Angular2 material 访问它外面的选项卡

Question

我有以下代码：

    <md-tab-group>
          <md-tab *ngFor="let section of sectionList">
        <template md-tab-label>
<span (click)="selectedSection=section">
           {{section.name}}
</span>
         </template>
        </md-tab>
        </md-tab-group>

如何在选项卡循环外显示当前选定部分（section 对象）的数据？

我尝试用 (click) 添加 span 但无法触发。

Answer 1

选项卡组有一个 selectedIndex 属性，因此您可以为其创建一个 template reference，然后使用它。

<md-tab-group #tabGroup>
 <md-tab *ngFor="let section of sectionList">
  <template md-tab-label>
    <span (click)="selectedSection=section">
       {{section.name}}
    </span>
  </template>
 </md-tab>
</md-tab-group>
<div>{{sectionList[tabGroup.selectedIndex].name}}</div>

Angular2 material 访问它外面的选项卡

Angular2 material access tab outside it

angular

angular2-material