selectedIndex 不適用於 mat-tab-nav-bar 角度材料選項卡

Question

我寫了如下標簽代碼

<nav mat-tab-nav-bar [selectedIndex]="0">
    <a mat-tab-link 
        *ngFor="let link of navLinks; let i = index;"
        [routerLink]="link.path"
        routerLinkActive #rla="routerLinkActive"
        [active]="rla.isActive">
        <div class="link-tab-label">{{link.label}}</div>
        <mat-icon class="link-tab-close" (click)="closeTab(i)">close</mat-icon>
    </a>
</nav>

當我運行該項目時，我遇到了如下所示的問題

compiler.js:485 Uncaught Error: Template parse errors:
Can't bind to 'selectedIndex' since it isn't a known property of 'nav'. ("
        <mat-card>
          <mat-card-content>
              <nav mat-tab-nav-bar [ERROR ->][selectedIndex]="0">

如何將 selectedIndex 與 mat-tab-nav-bar 一起使用？

Answer 1

mat-tab-nav-bar沒有selectedIndex屬性，並且mat-tab-nav-bar內的mat-tab-link並不是真正的選項卡。 mat-tab-nav-bar “提供了一個類似選項卡的 UI，用於在路由之間導航。” 要設置活動的“選項卡”或鏈接，您可以通過應用程序的路由器設置活動路由。 “選項卡”通過routerLinkActive指令和active屬性顯示為活動active 。

Answer 2

// try to add in module files 

import {MatTabsModule} from '@angular/material/tabs';