如何在 angular-6-datatable 中更改分页器的背景颜色答案

【问题标题】：how to change background color of paginator in angular-6-datatable如何在 angular-6-datatable 中更改分页器的背景颜色
【发布时间】：2019-04-04 04:58:25
【问题描述】：

所以我在我的项目中使用angular-6-datatable (https://www.npmjs.com/package/angular-6-datatable)。但我似乎无法更改分页器的背景颜色。它看起来像这样：

即使使用 !important，我也尝试了内联样式，但它仍然不会改变。

我在这里错过了什么？

【问题讨论】：

标签： html css angular datatables angular6

【解决方案1】：

在:host /deep/ 中添加你的分页器css，如下所示：

:host /deep/ {
 /*paginator style goes here*/
}

或

::ng-deep {
 /*paginator style goes here*/
}

【讨论】：

刚试了一下，好像没什么用？ deep 这里是什么？
你试过 ::ng-deep 吗？ ::ng-deep 为我工作你能试着告诉我吗？
刚刚试过了，它可以工作，但不是将活动页码着色（即 1），而是将页码 2 着色
您只需要为活动编号添加颜色应该有类活动检查并将css仅应用于该类，或者您可以在这里分享您的代码吗？

【解决方案2】：

如果您只想在第 1 页上设置颜色，那么您只需分配一个动态类。

<div class="pagination" [ngClass]={'active':pageIndex == 1}>
    <!-- pagination stuff hear...  -->
</div>

在 .ts 文件中

pageIndex : any = '1';  // You have to update this when pagination value update , This way : pageIndex ++;

在 scss 文件中

:host ::ng-deep .pagination .active{
    background:red;
}

【讨论】：