彩色编码的UI电网不工作headerCellClass

我正在尝试设置使用headerCellClass在这个例子中，标题的颜色：彩色编码的UI电网不工作headerCellClass

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

UI-GRID header - Change Color And Text

将其具有相反的颜色代码像'白色'，'红色等我试图使用颜色代码：headerCellClass: '#3A01DF'但它不工作。为什么？

来源

2017-10-13 President Camacho

你有没有在你的css中设置颜色 - 白色？像：

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

来源

2017-10-13 09:23:48 David

我要到u se颜色代码像'＃3A01DF'而不是'white' –

是的，所以当你在css中设置颜色时，只需要： '.color {color：＃3A01DF; ！重要; }' 所以，当你设置的颜色'headerCellClass'它会不会从你的CSS颜色代码： 'columnDefs：[{ 场： '名'，headerCellClass： '颜色'}，{ 领域： 'company'，headerCellClass：'color'} ]，' – David

我想设置我的颜色动态，所以不能真正将它添加到CSS文件中：''headerCellClass：'{color：'+ option.color +' ！重要; }'' –

您可以设置不同的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网样本：http://ui-grid.info/docs/#/tutorial/115_headerCellClass

来源

2017-10-15 12:04:13

彩色编码的UI电网不工作headerCellClass

回答

相关问题