Question

我正在使用角垫桌。

我的问题是mat-cell高度总是14px（内容大小），但我想修复mat-row高度：

      <mat-table #table [dataSource]="dataSource">

      <ng-container matColumnDef="NAME">

        <mat-header-cell fxFlex="100%" class="my-mat-header" *matHeaderCellDef> 
          {{'NAME' | translate}} 
        </mat-header-cell>

        <mat-cell fxFlex="100%" class="my-mat-cell" *matCellDef="let element">
          {{ element.name }}
        </mat-cell>

      </ng-container>

      <mat-header-row *matHeaderRowDef="displayedColumns" class="my-mat-header-row"></mat-header-row>
      <mat-row *matRowDef="let row; columns: displayedColumns;" class="my-mat-row"></mat-row>
    </mat-table>

    .my-mat-row {
       min-height: 100%;
       border-bottom: none;
       padding: 5px 0;
    }

   .my-mat-cell {
     color: black;
     cursor: pointer;
     min-height: 100%;
   }

mat-row height是50px，但mat-cell只有14px。

如何填补父高？

Answer 1

由于matTable行是flex容器，你应该使用它：

 .my-mat-row {
   ....
   align-items: stretch;
   ....
 }

这样所有细胞都会伸展到全高

mat-cell高度不填充父级

1 个答案: