如何使用角度显示模式中的数据2

Question

我有一个带按钮的表格。我需要的是当我点击表格中的按钮时，它的价值模式diplay。 我的问题是如何将表格的值传递给模态。任何一个可以帮助我，这里是代码

 <div style="margin-top: 50px" class="col-md-12"> 
     <div class="card"> 
      <div class="card-block"> 
      <div class="horizontal-scroll"> 
       <table class="table table-condensed"> 
       <thead> 
        <tr> 

        <th>Titre</th> 
        <th>Description</th> 
        <th>Durée (jours)</th> 
        <th>Coût (TalanCoin)</th> 
        <th>Action</th> 

        </tr> 
       </thead> 
       <tbody> 
        <tr *ngFor="let item of formations"> 

        <td>{{ item[1] }}</td> 
        <td style="margin-left: 4cm;"> 
         <button type="button" class="btn btn-info btn-icon" (click)="smModal.show()"><i class="ion-information"></i></button> 


         </td> 

        <td>{{ item[3] }}</td> 
        <td>{{ item[4] }}</td> 
        <td > 

         <button class="btn btn-success" (click)="clicked(item[4],lgModal)">Participer</button> 

        </td> 
        </tr> 
       </tbody> 
       </table> 
      </div> 
      </div> 
     </div> 
     </div> 

    <!-- Small modal --> 
    <div bsModal #smModal="bs-modal" class="modal fade" tabindex="-1" 
    role="dialog" aria-labelledby="mySmallModalLabel" aria- 
    hidden="true"> 

    <div class="modal-dialog modal-sm"> 
     <div class="modal-content"> 
     <div class="modal-header"> 
      <button class="close" aria-label="Close" 
      (click)="smModal.hide()"> 
       <span aria-hidden="true">&times;</span> 
      </button> 
       <h4 class="modal-title">Description</h4> 
      </div> 
      <div class="modal-body" style="color: black;"> 
     <!--here I want to display the value selected from the table--> 
     </div> 
     <div class="modal-footer"> 
     <button class="btn btn-primary confirm-btn" 
     (click)="smModal.hide()">Save changes</button> 
     </div> 
</div> 

Answer 1

你可以使你的组件的功能将打开这样的模式：

... 
export class AppComponent {  
    @ViewChild('smModal') smModal; 
    currentItem; 
    ... 
    openModal(item: any) { 
    this.currentItem = item; 
    this.smModal.show(); 
    } 
} 

然后代替smModal.show()可以致电openModal(item)。在模式中，您可以访问{{ currentItem }}，与访问表格中的item的方式相同。