角材料選項卡未突出顯示

Question

由於[(selectedIndex)]="" ，我試圖以編程方式設置所選索引，但它可以正常工作，但是每當我選擇帶有此索引的索引時，所選項目就不會突出顯示。

選擇它是因為您可以看到它的內容，但是沒有圖形顯示所選的選項卡狀態。 這是錯誤還是可以通過某種方式完成？

HTML

 <mat-tab-group [(selectedIndex)]="this.dataService.selectedTabs[0]">
  <mat-tab *ngFor="let Tab of this.dataService.Tabs">
    <ng-template mat-tab-label>
      {{Tab.label}}
    </ng-template>
    <div *ngIf="Tab.childTabs.length !== 0">
     //INSIDE OF THIS SECTION THERE ARE MORE NESTED TABS
    </div>
  </mat-tab>
</mat-tab-group>

當我打開此選項卡時，其內容內的嵌套選項卡將不會突出顯示，而是會打開。

s

public selectedTabs: any[] = [
    0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0
];

Answer 1

此解決方案有效，但主要是一種解決方法。 只需在style.css文件中添加以下代碼：

.mat-tab-label-active {
bottom-border-style:solid !important;
opacity: 1 !important;
}