带有角垫表的列高亮显示

时间:2019-12-10 17:13:33

标签: angular angular-material mat-table

我想突出显示我的排序列以获得更好的UI体验,但是我的问题是:mat-table仅触发表头上的类。

垫子表的工作方式如下:

单击标题单元格以对表进行排序,将mat-sort-header-sorted类添加到div.mat-sort-container。问题是:这个div是div.mat-header-cell的子元素,并且只有这个子元素。

角形mat-table不会在同一列的其他单元格中添加任何内容,当您要样式化整个列时,这很麻烦。

那么,有没有办法用Angular mat table突出显示整个列?

1 个答案:

答案 0 :(得分:0)

您拥有……的“属性”

@ViewChild(MatSort, {static: true}) sort: MatSort;

“有效”,因此,您可以例如写

<td [style.background-color]="sort?.active=='id'?'red':null"..>

请参见example