为 angular ui 网格中的每一列涂上不同的颜色

Question

我希望能够用不同的颜色为 ui- 网格中的每一列着色。我想指定每列的颜色应该是什么。当前在 ui 网格中有没有办法做到这一点？

Answer 1

这是通过使用 cellClass columnDef 属性 实现的，如 here 所述。

cellClass 可以是字符串或 function(grid, row, col, rowRenderIndex, colRenderIndex) 即 returns 和 class 名称。所以，基本上在定义你的列时做这样的事情：

gridOptions.columnDefs = [{field: 'field1', cellClass: 'yourClass'}];

更改背景颜色时要小心，因为它会被单元格背景覆盖。您应该在 css:

中添加类似这样的内容

.ui-grid-row .ui-grid-cell {
   background-color: inherit !important;
}