网格样式-覆盖Ag-grid的样式

Question

我有以下风格：

.ag-theme-fresh .ag-row-selected {
    background-color: #bde2e5; 
}`

它来自主题的CSS样式文件。但是我想用这种风格覆盖它：

.ag-theme-fresh .ag-row-even .ag-row-selected {
  background-color: #1428df;
}

但这没有效果，我的组件使用第一种样式。如何覆盖第一个样式1？我尝试过，!important但它什么也没做。

我应该在css文件的开头定义自定义样式吗？

更新：

我发现我可以使用函数gridOptions.getRowClass设置要使用的样式类。但是我想解决中心问题（对于我在应用程序中使用的所有角度网格）。任何的想法？

Answer 1

你应该用 ViewEncapsulation

只需添加到您的组件encapsulation: ViewEncapsulation.None：

import { Component, ViewEncapsulation } from "@angular/core";

@Component({
    selector: '....',
    templateUrl: '....',
    styles: [`
        .ag-theme-fresh .ag-row-selected {
            background-color: #1428df !important;
        }
    `],
    encapsulation: ViewEncapsulation.None
})