处理节点时如何在 ag-Grid 中设置单元格样式？答案

【问题标题】：How to set cell style in ag-Grid while processing nodes?处理节点时如何在 ag-Grid 中设置单元格样式？
【发布时间】：2017-05-13 05:45:35
【问题描述】：

ag-Grid 提供了一种使用 cellStyle 来修改单元格样式的机制。

但是，我想在处理节点时更改单元格的颜色。我知道要更改颜色的确切节点。

有没有办法做到这一点？

【问题讨论】：

我决定将已更改的值存储在数组和 cellStyle 函数中，检查单元格值是否在数组中并适当地着色。不是最好的解决方案，但它确实有效。

标签： javascript ag-grid

【解决方案1】：

最简单的解决方案是使用单元格渲染函数：

// put the value in bold
colDef.cellRenderer = function(params) {
    return '<b>' + params.value.toUpperCase() + '</b>';
}

您可以根据节点的值应用样式 - 这将在 params 参数中提供

【讨论】：

我需要做类似 node.cell.cellStyle = {border: '1px solid red', 'text-align' : 'center'};

【解决方案2】：

在 column 属性中使用 cellStyle 或 cellClass 或 cellClass 并返回

 var colDef = {name: 'Dynamic Styles', field' 'field2', cellStyle: cellStyling}

function cellStyling(params){
    if(true){
        return {'background-color':''};
    } else {
        return {'color': '#9B9999' ,'background-color':'#E8E2E1'};
    }
 }

根据您的评论，代码可以使用--

 $scope.gridOptions.api.forEachNode(function(node){
    for(var j=0;j<node.gridOptionsWrapper.columnController.allDisplayedColumns.length;j++){
    if(node.gridOptionsWrapper.columnController.allDisplayedColumns[j].colDef.headerName==="column Name"){
            node.gridOptionsWrapper.columnController.allDisplayedColumns[j].colDef.cellStyle = {apply style};
    }
  }
}

【讨论】：

我需要做类似 node.cell.cellStyle = {border: '1px solid red', 'text-align' : 'center'};