提问者:小点点

隐藏MatPaginator详细信息


我试图隐藏由MatPaginator自动添加的字符串(每页项:1 1-1,共2项),我尝试通过设置display:none;display:none!important;到容器类来执行CSS方式,但这不起作用:

.mat-paginator-page-size{
    display: none !important;
}

.mat-paginator-range-label{
    display: none !important;
}

我只希望下一个和前一个箭头显示,没有任何其他细节。


共1个答案

匿名用户

在两者前面添加::ng-deep:

::ng-deep .mat-paginator-page-size{
    display: none !important;
}

::ng-deep .mat-paginator-range-label{
    display: none !important;
}

::ng-deep将样式强制到子组件。

对任何CSS规则应用::NG-Deep伪类将完全禁用该规则的视图封装。 任何应用了::NG-deep的样式都将成为全局样式。 为了将指定样式的范围覆盖到当前组件及其所有子组件,请确保在::ng-deep之前包括:host选择器。 如果使用::ng-deep组合器而不使用:host伪类选择器,则样式可能会渗入其他组件。

https://angular.io/guide/component-styles