Ag-grid master/detail：扩展细节时的自定义行样式

Question

对于我的工作，我使用 angular 7 和 ag-grid 企业最新版本。我有一个配置了主/详细功能的 ag-grid 表，我需要在展开详细信息时自定义行的样式。例如，我想仅在展开详细信息时更改行的背景颜色。我尝试了 CSS 规则：

.ag-theme-material .ag-row-focus {
   background-color: $dark-grey-blue !important;
}

但我没有得到正确的行为，因为即使没有展开细节，点击它的行也会改变颜色，而我希望它只有在展开细节时才会改变颜色。 我试图查看 ag-grid 的官方文档，但我没有找到这个特定案例的迹象。 你能帮我吗？ 谢谢

Answer 1

您可以使用网格回调 getRowStyle 来完成此操作，并检测节点是否展开：

gridOptions.getRowStyle = (params) => {
    if (params.node.expanded) {
        return { background: 'red' };
    } else {
        return { background: 'green' };
    }
}