タブナビバーでmd-stretch-tabsを使用する

Question

ページの幅を埋めるためにタブを引き伸ばす必要があります。 下の言葉のコードでmd-stretch-tabsはどのように使うべきですか？ご意見をお聞かせください。 はあなたに以下のように割合にMIN-幅スタイルを設定し

<nav md-tab-nav-bar aria-label="weather navigation links"> 
    <a md-tab-link 
     *ngFor="let tabLink of tabLinks; let i = index" 
     [routerLink]="tabLink.link" 
     [active]="activeLinkIndex === i" 
     (click)="activeLinkIndex = i"> 
     {{tabLink.label}} 
    </a> 
    </nav> 
    <router-outlet></router-outlet> 

Answer 1

.mat-tab-links { 
    display: table; 
    width: 100%; 

    .mat-tab-link { 
     display: table-cell; 
    } 
} 

Answer 2

、

this.minWidth=100/this.routeLinks.length; 

<a md-tab-link [style.min-width]="minWidth + '%'" >... 

LIVE DEMO