Ag-Grid - 访问所有数据 - 包括计算列

Posted 2023-03-28

【中文标题】Ag-Grid - 访问所有数据 - 包括计算列

【英文标题】：Ag-Grid - Access All Data - including calculated columns

【发布时间】：2020-02-29 20:49:27

【问题描述】：

尝试访问在 Ag-Grid 中呈现的所有数据 - 包括使用 value getters 的计算列的值。我只能访问提供给 Ag-Grid 的数据，但不能访问任何计算列（参见下面的代码）。

  var items = [];
  var cnt = gridOptions.api.getDisplayedRowCount();
  for (var i = 0; i < cnt; i++) 
    var rowNode = gridOptions.api.getDisplayedRowAtIndex(i);
    items.push(rowNode.data);
  

任何建议将不胜感激。我正在尝试将计算列的输出保存到数据库中。

【参考方案1】：

想到一个解决方法 - 在 valueGetter 函数中写入数据。这样数据存储计算值，然后可以使用内置的 api 函数（例如使用 forEachNode）导出。

valueGetter: function (params)

  //your normal value getter logic here
  var output = params.data['column1'] + params.data['column2']

  //write to the data
  var col = params.colDef.field;
  params.data[col] = output;

  return output;

【讨论】：

这真的很有趣。就我而言，这不适用于我表格最右侧的那些延迟加载的列，直到我滚动到它们。如果我滚动到延迟加载的计算字段，则只有在上面的代码中计算的数据才可用。我在ag-grid-community: 24.1.0 和ag-grid-angular: 24.1.0。

【参考方案2】：

我就是这样做的，而不必直接在 valueGetter 函数中获取数据。它不是超级干净，但它得到了预期的计算值。我使用的是 24.1.0 版本。

const columnKeys = this.gridColumnApi.getColumnState().map(c => c.colId);
const rows = [];

this.gridApi.forEachNode(rowNode => 
  const row = [];
  for (const key of columnKeys) 
    // getValue will get the calculated value at key in the rowNode
    row.push(this.gridApi.getValue(key, rowNode));
  

  rows.push(row);
);

console.log(rows);