如何在Angular5中循环通过NGX智能模式

我在Angular5项目中与NGX Smart Modal合作,当不在*NGFOR循环中时,NGX Smart Modal工作得非常完美。我所要做的就是从数据库中提取数据,并根据循环的数目显示。这是我的密码。

<div class="container">

    <div class="row">

     <div class="col-md-4 col-sm-6" *ngFor = "let modules of get_modules; let i = index">
          <article class="post-news"><a class="mouserPointer" (click)="ngxSmartModalService.getModal('myModal').open()"><img src="./assets/images/{{ modules.imagepath }}" alt="" class="img-responsive"></a>
                    <div class="post-news-body">
                      <h6><a class="mouserPointer" (click)="ngxSmartModalService.getModal('myModal').open()" >{{ modules.heading }} </a></h6>
                      <div>
                        <p>{{ modules.body }}</p>
                      </div>
                      <!-- <div class="post-news-meta offset-top-20"><span class="text-black"><span class="fa fa-clock-o"></span>2 days ago</span></div> -->
                    </div>
                  </article>
                  <!-- Print popup modal alongside -->
               <ngx-smart-modal #myModal identifier="myModal">
      <h1>{{ modules.heading }}!</h1>
      <img class="img-responsive" src="./assets/images/faa.jpg" alt="">
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ullamcorper neque ac ullamcorper scelerisque. Proin molestie erat sapien, ac dapibus tortor placerat a. Vivamus quis tempor mauris. Ut porta ultricies nisi in eleifend. In magna nisi, tempor pharetra consequat in, sagittis id augue. Aliquam eu lectus id mi vulputate convallis. Nam facilisis nisl quis urna gravida tempus.</p>

      <button (click)="myModal.close()" class="btn btn-danger">Close</button>
    </ngx-smart-modal>


       </div>

    </div>


  </div>

我尝试了几种方法,比如使用模式标识符来循环索引,但仍然没有成功。就像。

<div class="container">

    <div class="row">

     <div class="col-md-4 col-sm-6" *ngFor = "let modules of get_modules; let i = index">
          <article class="post-news"><a class="mouserPointer" (click)="ngxSmartModalService.getModal('{{i}}').open()"><img src="./assets/images/{{ modules.imagepath }}" alt="" class="img-responsive"></a>
                    <div class="post-news-body">
                      <h6><a class="mouserPointer" (click)="ngxSmartModalService.getModal('{{i}}').open()" >{{ modules.heading }} </a></h6>
                      <div>
                        <p>{{ modules.body }}</p>
                      </div>
                      <!-- <div class="post-news-meta offset-top-20"><span class="text-black"><span class="fa fa-clock-o"></span>2 days ago</span></div> -->
                    </div>
                  </article>
                  <!-- Print popup modal alongside -->
               <ngx-smart-modal #{{i}} identifier="{{i}}">
      <h1>{{ modules.heading }}!</h1>
      <img class="img-responsive" src="./assets/images/faa.jpg" alt="">
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ullamcorper neque ac ullamcorper scelerisque. Proin molestie erat sapien, ac dapibus tortor placerat a. Vivamus quis tempor mauris. Ut porta ultricies nisi in eleifend. In magna nisi, tempor pharetra consequat in, sagittis id augue. Aliquam eu lectus id mi vulputate convallis. Nam facilisis nisl quis urna gravida tempus.</p>

      <button (click)="myModal.close()" class="btn btn-danger">Close</button>
    </ngx-smart-modal>


       </div>

    </div>


  </div>

任何帮助都将不胜感激,谢谢。