如何在知道Ag-grid中行索引和字段名称的单元格上着色？

Question

让， 行索引= 5＆字段='年龄' 现在，如何为ag-grid中具有row = 5和field ='age'的单元格着色？我已经尝试了最近两天，但是未能实现。

Answer 1

我想您有一个包含行索引和字段名称的对象数组：

rowIndexes = [ 
  { row: 3, field: ['age']}, 
  { row: 5, field: ['name']}, 
  { row: 10, field: ['name', 'salary'] }
];

将cellStyle属性添加到每个columnDef：

{
  headerName: 'Name',
  field: 'name',
  cellStyle: (params) => {
    let rowIndex = params.node.rowIndex;
    if (this.isColoredCell(rowIndex, 'name'))
      return { backgroundColor: 'red' }
    return null;
  }
}
...
...

并将您的逻辑添加到isColoredCell方法中：

isColoredCell(rowIndex: number, field: string): boolean {
  let indexes = this.rowIndexes.filter(item => item.row == rowIndex);
  if (indexes.length > 0) {
    let fields = indexes[0].field;
    if (fields.indexOf(field) > -1) {
      return true;
    }
    return false;
  }
  return false;
}

希望您可以通过这种方式为细胞着色。