2

次のコードがあります。

<md-tab-group (selectChange)="doSomething()">
  <md-tab *ngFor="let p of something))">
    <template md-tab-label>
     {{p.name}} ...
    </template>
   </md-tab>
 </md-tab-group>

これで doSomething() get が Tab-Change で起動され、選択したインデックスにアクセスできるようになりましたが、私の *ngFor ループの値にアクセスする方法はありますか? 開いているタブに応じて、データベースからデータを取得するには、コードに「p.id」が必要です。それとも、私が考えていないもっとエレガントな解決策がありますか? 助けてくれてありがとう:)

4

2 に答える 2

1

興味のある人のために、私はこの方法で問題を解決しました：

  1. *ngFor によって生成されたタブに data-attrib を追加し、タブグループ全体を関数に渡します。
<md-tab-group #tabgroup (selectChange)="doSomething(tabgroup)">
          <md-tab *ngFor="let p of something" [attr.data-pid]="p.id">
            <template md-tab-label>
             {{p.name}} ...
            </template>
           </md-tab>
         </md-tab-group>
  1. 選択した md-tab を nativeElement と共に取得し、そこから data-attrib を取得します。きれいではありませんが、うまくいきます。
doSomething(tabgroup: MdTabGroup) {

        let pid = tabgroup._tabs.find((e, i, a) => i == tabgroup.selectedIndex)
            .content.viewContainerRef.element.nativeElement.dataset.pid;

        console.log(pid);
    }
于 2016-12-17T14:31:06.993 に答える