嵌套选项卡组上的角度材料选项卡组问题(未显示默认选项卡)

Pab*_*hez 4 nested angular-material angular

我面临以下问题,将 mat-tab-group 嵌套在 mat-tab-group 中。父组第一个选项卡中的嵌套组选择默认选项卡并在第一个选项卡中显示下划线,但嵌套在父组第三个选项卡中的组,在任何选项卡中都不显示下划线。

我已附上问题的演示链接:https : //stackblitz.com/edit/angular-material-tabs-problem

有什么帮助吗?提前致谢!

Kat*_*tja 7

正如这篇文章所建议的那样https://github.com/angular/components/issues/7274#issuecomment-605516292用 a 包裹你的孩子 mat-tab-group<ng-template matTabContent>并且它会工作(用 Angular 8 测试)。

<mat-tab-group>
  <mat-tab label="Tab1">
    Test1
  </mat-tab>
  <mat-tab label="Tab2" >
    <ng-template matTabContent>
      <mat-tab-group>
        <mat-tab label="Tab2-1">
          Test2-1
        </mat-tab>
        <mat-tab label="Tab2-2">
          Test2-2
        </mat-tab>
      </mat-tab-group>
    </ng-template>
  </mat-tab>
</mat-tab-group>
Run Code Online (Sandbox Code Playgroud)