如何自定义角度的ui网格行背景颜色？

我想改变基于条件的角度ui网格行的背景颜色，所以如果riskValue是1，试图使其红色，如果值是2行背景颜色应该是黄色。任何简单的方法来完成这项任务？如何自定义角度的ui网格行背景颜色？

config.js

"columnDefs": [{ 
     "name": "Ticket Number", 
     "field": "ticketNum", 
     "width": 120 
    }, 
    { 
     "name": "Asset Id ", 
     "field": "assetID", 
     "width": 100 
    }, 
    { 
     "name": "Severity", 
     "field": "severity", 
     "width": 100 
    }, 
    { 
     "name": "Risk Index", 
     "field": "riskIndex", 
     "width": 100 
    }, 
    { 
     "name": "Risk Val", 
     "field": "riskValue", 
     "cellTemplate": "<div ng-if=\"row.entity.Comments_Col1 != 'none'\" title={{row.entity.riskValue}} \" ><div style='white-space:nowrap;border-bottom: 1px solid red !important; height:100%;width:100%;'>{{row.entity.riskValue}}</div></div>", 
     "sort": { 
      "direction": "aesc", 
      "priority": 0 
     }, 
     "width": 100, 
     "visible": false 
    } 
],

来源

2017-10-20 hussain

的可能的复制[？如何颜色在角UI电网特定值的行（https://stackoverflow.com/questions/26362666/how-to-color-row- on-specific-in-angular-ui-grid） – RogerC

不会添加诸如“background-color”的行：＃2dff07工作吗？ – n4feng

您可以使用gridOptions.cellClass

cellClass: function(grid, row, col, rowRenderIndex, colRenderIndex) { 
    if (row.entity.riskValue === 1) 
     return 'red'; 
    if (row.entity.riskValue === 2) 
     return 'yellow'; 
}

其中red和yellow是CSS类。

此方法需要将该函数添加到所有columnDefs，但只允许选择一些应该更改背景颜色的列。

样品：http://plnkr.co/edit/Xie68a3sT9CXTdCuI3tq?p=preview

来源

2017-10-20 16:24:37

如何自定义角度的ui网格行背景颜色？

回答

相关问题