反应 - 自定义样式 ag 网格标题

Question

它是关于每行中的反应 ag 网格列标题而不是单元格。

我有 4 列，我想使前 2 的标题 bg 颜色为黑色，后 2 的标题 bg 颜色为绿色。

return[
{
headerName: 'name',
field: 'name',   
},
{
headerName: 'age',
field: 'age',     
},
{
headerName: 'city',
field: 'city',   
},
{
headerName: 'state',
field: 'state',
},
]

尝试通过 using.ag-header-group-cell-label来控制CSS，但这会使所有列具有相同的BG颜色。 有人说使用headerComponentFramework，如果它有效可以提供一个例子吗？

Answer 1

可以在列定义中使用 headerClass 属性：

[
{
headerName: 'First',
field: 'first',
headerClass: 'header-black'
},
{
headerName: 'Second',
field: 'second',
headerClass: 'header-green'
}
]

然后在你的 css 中：

.header-black {
background-color: black;
}
.header-green {
background-color: green;
}

https://embed.plnkr.co/T81TLEjln2Jzwdfy/