Угловой материал мат-вкладка-этикетка

Question

Я хочу получить доступ к имени последовательности из события selectedTabChange

<mat-tab-group (selectedTabChange)="onSequenceChangeEvent($event, sequence)">

<mat-tab  *ngFor="let sequence of sequencesForSelectedScope">

    <ng-template mat-tab-label>
        <span>{{sequence.sequenceName}}</span>
    </ng-template>

</mat-tab>

В этом событии я могу получить доступ к следующему: sequenceEvent.tab.templateLabel.context, но этот контекст не определен.Как я могу установить это, например, sequence.sequenceName?

Answer 1

Есть способ сделать это, но это немного взломать.Если вы назначите свои данные «sequence» на вход «label» вкладки, вы можете получить их из MatTabChangeEvent.Это работает только потому, что вы используете метки шаблонов, поэтому вы можете «перенаправить» ввод метки:

<mat-tab-group (selectedTabChange)="onSequenceChangeEvent($event)">

<mat-tab *ngFor="let sequence of sequencesForSelectedScope" [label]="sequence">

    <ng-template mat-tab-label>
        <span>{{sequence.sequenceName}}</span>
    </ng-template>

</mat-tab>

onSequenceChangeEvent(event: MatTabChangeEvent) {
  console.log(event.tab.textLabel.sequenceName);
}