angular-material - Angular Material 导航栏 - 看不到标签

Question

这是我的导航栏代码：

<nav mat-tab-nav-bar>
    <a mat-tab-link
      *ngFor="let link of navLinks"
      [routerLink]="link.link"
      routerLinkActive #rla="routerLinkActive"
      [active]="rla.isActive">
    </a>
</nav>

和组件：

export class SettingsComponent implements OnInit {
  navLinks: any[];
  activeLinkIndex = -1;
  constructor(private router: Router) {
    this.navLinks = [
        {
            label: 'First',
            link: 'syspref',
            index: 0
        }, {
            label: 'Second',
            link: 'userpref',
            index: 1
        }
    ];
}
ngOnInit(): void {
    this.router.events.subscribe((res) => {
        this.activeLinkIndex = this.navLinks.indexOf(this.navLinks.find(tab => tab.link === '.' + this.router.url));
    });
  }
}

它工作正常，除了我没有看到标签。知道为什么吗？

谢谢

Answer 1

找到了。我错过了 {{link.label}}：

<nav mat-tab-nav-bar>
    <a mat-tab-link
      *ngFor="let link of navLinks"
      [routerLink]="link.link"
      routerLinkActive #rla="routerLinkActive"
      [active]="rla.isActive">{{link.label}}
    </a>
</nav>