css - 当我在 Angular Material 的选项卡之间切换时，会显示滚动条吗？

Question

<widget-shell [title]="data.title" (closeButtonClicked)="onCloseButtonClick($event)">
<mat-tab-group (selectedTabChange)="tabChange()">
    <mat-tab label="Data">
        <graph-bar *ngIf="graphSettings" [tabChanged]="tabChanged" [settings]="graphSettings.dataSeries"></graph-bar>
    </mat-tab>
    <mat-tab label="SMS">
        <graph-bar *ngIf="graphSettings" [tabChanged]="tabChanged"  [settings]="graphSettings.smsSeries"></graph-bar>
    </mat-tab>
    <mat-tab label="Voice">
        <graph-bar *ngIf="graphSettings" [tabChanged]="tabChanged"  [settings]="graphSettings.voiceSeries"></graph-bar>
    </mat-tab>
</mat-tab-group>

In the CSS:

::ng-deep .mat-tab-body-content {
      overflow: visible !important;
    }

By using the above css solved the issue,but is there some other way that we can achieve the same without using !important

Answer 1

这里有一个更好的解决方案(在 v-7 上测试过):

<mat-tab-group [dynamicHeight]='true'>