Question

我尝试使用headerCellClass设置标题的颜色，如下例所示：

columnDefs: [
  { field: 'name', headerCellClass: 'white' },
  { field: 'company',headerCellClass:'white'}
],

UI-GRID header - Change Color And Text

而是设置颜色代码，例如＆＃39; white＆＃39;，＆＃39; red等。我尝试使用颜色代码：headerCellClass: '#3A01DF'但它不起作用。为什么呢？

Answer 1

你的css中有白色吗？像：

.white { color: white;background-color:black !important;  }

Answer 2

您可以在css中设置不同的类（红色，默认类，黑色等）：

.red {
    background-color: red !important;
    color: #F3F3F3 !important;
}

.default-class {
    background-color: #004A75 !important;
    color: #FFFF00 !important;
}

.black {
    background-color: black !important;
    color: white !important;
}

并在headerCellClass函数中，根据条件（或只是一个类）返回一个合适的类：

headerCellClass: function(grid, row, col, rowRenderIndex, colRenderIndex) {
    if (condition === 1) 
        return 'red';
    if (condition === 2)
        return 'black';

    return 'default-class';
},

来自ui-grid的示例：http://ui-grid.info/docs/#/tutorial/115_headerCellClass

颜色代码不适用于ui-grid headerCellClass

2 个答案: