角度 ag-grid 使用 getRowStyle 设置行颜色禁用 rowSelection 颜色

Question

我有一个 ag-grid，我想在其中自定义行的背景颜色。

onGridReady(params) {
    this.gridApi = params.api;
    this.gridColumnApi = params.columnApi;
    params.api.sizeColumnsToFit();
    this.initialize();
    this.gridOptions.getRowStyle = this.changeRowColor;

}

这里是changeRowColor：

changeRowColor(params) {
    return {
        'background-color': params.data.backgroundColor
    };
}

问题是当我启用 [rowSelection]="'multiple'" 时，选定的行没有突出显示。通过注释掉 getRowStyle，我确定这两个功能不兼容。当我这样做时，行会在选择时突出显示。

有人有解决方法的想法吗？

Answer 1

您的行级样式覆盖了默认的ag-grid 样式。

在这种情况下突出显示选定行的一种方法是覆盖选定行的单元格级别样式。

.ag-fresh .ag-row-selected {
    background-color: #66bfff !important;
    .ag-cell {
        background-color: #66bfff !important;
    }
}

上面的 CSS 显示了 ag-fresh 主题的解决方法。要使其适用于其他主题，请相应地添加类。