angular - タブをクリックすると、mat-tab-group の間隔が変更されます

Question

以下のコードを使用する場合は、angular4 のマテリアルを使用しています。タブは適切に表示されますが、任意のタブをクリックしてタブを切り替えると、タブ間のスペースが変更され、フレックススタイルのスペース間のスペースなどが適用されているかのように狭くなります。私は追加のスタイリングを追加していません。以下のコンポーネントを<mat-sidenav-content>if 内で使用していますが、違いはありません。

<mat-tab-group [@.disabled]="true">
  <mat-tab label="Overview">
    <div>{{routeData.overview}}</div>
  </mat-tab>
  <mat-tab label="API">
    <div>{{routeData.api}}</div>
  </mat-tab>
  <mat-tab label="Examples">
    <div>{{routeData.examples}}</div>
  </mat-tab>
</mat-tab-group>