我确实有材料表,其中使用了 9 列,即使屏幕缩小,我也想保持相同的列大小。
目前,当我缩小屏幕时,最后一列首先被逃避,这看起来有点奇怪,因为其他组仍然具有相同的大小。
即使屏幕尺寸缩小,我们是否也可以支持“总结算金额”相同的栏尺寸?
下面是我的堆栈闪电战
https://stackblitz.com/edit/angular-bklajw-5foa62?file=app%2Ftable-basic-example.ts
我在角材料卡内使用材料表。这是我的代码:
<mat-card style="margin: 5px;font-family:Arial, Helvetica, sans-serif!important;font-size:10px !important;" class="mat-elevation-z15"
fxFlex>
<mat-card-content fxLayout="column" fxLayoutAlign="space-between" fxFlex>
<h4>Incidents</h4>
<mat-table #table [dataSource]="dataSource" matSort class="mat-elevation-z8">
<ng-container matColumnDef="number">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Number</th>
<td mat-cell *matCellDef="let element">{{ element.number }}</td>
</ng-container>
<ng-container matColumnDef="desc">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Description</th>
<td mat-cell *matCellDef="let element">{{ element.desc }}</td>
</ng-container>
<ng-container matColumnDef="assn_group">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Group</th>
<td mat-cell *matCellDef="let element">{{ element.assn_group }}</td>
</ng-container>
<ng-container matColumnDef="product">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Product</th>
<td mat-cell *matCellDef="let element">{{ element.product }}</td>
</ng-container>
<ng-container matColumnDef="state">
<th mat-header-cell *matHeaderCellDef mat-sort-header>State</th>
<td mat-cell *matCellDef="let …Run Code Online (Sandbox Code Playgroud)