角度2要素の動的参照

Question

私は私のアプリでポップオーバーを作成するには、このパッケージを使用しています：
https://github.com/pleerock/ng2-popover
問題は、私はデータのngForを持つテーブルを持っているので、私は異なる行に異なるpopoversを必要としています。ここでは、コードは次のようになります。

 <div class="dt-row" *ngFor="let key of keys"> 
      <popover-content #actions 
          title="Actions" 
          placement="bottom" 
          [animation]="false" 
          [closeOnClickOutside]="true" 
          [closeOnMouseOutside]="false" 
          [disabled]="false" 
          [onHover]="false"> 
       <a>Edit</a> 
       <a>Delete</a> 
      </popover-content> 

      <div [popover]="actions"> 
       ... 
      </div> 
     </div> 

のでactions refはすべてngForインスタンスで同じです。
このrefを動的にするにはどうすればよいですか？ [ref]="'actions-' + key.id"のようなものです。

Answer 1

コメントあなたは、インデックスを使用する通り：

<div class="dt-row" *ngFor="let key of keys; let i = index;"> 
      <popover-content #i 
          title="Actions" 
          placement="bottom" 
          [animation]="false" 
          [closeOnClickOutside]="true" 
          [closeOnMouseOutside]="false" > 
       {{key.interestingInfo}} 
       <a>Edit - {{key.name}}</a> 
       <a>Delete - {{key.name}}</a> 
      </popover-content> 

      <div [popover]="i"> 
       {{key.clickText + key.name}} 
      </div> 
    </div> 
</div> 

そしてここでは、ポップアップ・コンテンツを実証する作業plunkerへのリンクだが、さまざまなコンテンツがあります。 http://plnkr.co/edit/kVJSnn?p=preview