2

我想使用同一列中其他行的值为特定行实现自定义计算。我发现 AG Grid 提供了定义列定义表达式和aggFunc的能力，但它们并不能解决我想要的问题：

  1. Column Definition Expressions（我们称之为 CDE）允许用户引用同一行的其他列
  2. aggFunc在用户可以使用内置函数或定义自定义聚合函数的分组情况下很有帮助，该函数只能在特定组内使用同一列的单元格值。

我需要解决以下问题：

Category groups         | Jan                        | Feb | Total
---------------------------------------------------------------------------------
Income                  | {it is place for aggFunc}  |     | {it is place for CDE}
    In 1                |                            |     |
    In 2                |                            |     |
    Ignored In in Net   |                            |     |
Liabilities             |                            |     |
Net Income       ???    | In 1 + In 2 - Liabilities  |     |
Net Income Total ???    | Income - Liabilities       |     |

结果应该是这样的：

Category groups         | Jan   | Feb | Total
----------------------------------------------
Income                  | 62    |  17 |  79
    In 1                | 12    |  10 |  22
    In 2                | 20    |  5  |  25
    Ignored In in Net   | 30    |  2  |  32
Liabilities             | 15    |  10 |  25
Net Income       ???    | 17    |  5  |  22
Net Income Total ???    | 47    |  7  |  54

那么，我如何通过 AG Grid (react)为Net Income行和Net Income Total行定义公式（表达式/聚合函数） ，我可以在其中引用同一列中任何需要的行（在上述情况下Net Income = In 1 + In 2 - Liabilities以及Net Income Total = Income - LiabilitiesJan、Feb 等）。 ）？可以使用哪个 API？

目前，我实现了这个DEMO，但在官方 AG Grid 文档中没有找到任何关于如何实现所需案例的线索，而且这个库是否有可能......

升级版。我试图通过以下方式实现它：

  1. 覆盖getRowNodeId()回调以具有可预测的 rowNodeId；
  2. api.getRowNode(rowId)通过;获取 rowNode
  3. 使用具有 2 个参数的getValue()(colKey, rowNode)函数，理论上它应该返回指定行的目标列的值。

结果我有：

gridOptions = {
  getRowNodeId: row => {
    return `${row.level0}${row.lastLevel}`;
  },
  ...
  columnTypes: {
    ...
    janType: {
      enableValue: true,
      aggFunc: 'sum',
      valueGetter: ({ data, getValue, api }) => {
        if (data.lastLevel === 'Net Income') {
          const in1Row = api.getRowNode('IncomeIn 1');
          const in2Row = api.getRowNode('IncomeIn 2');
 
          // Uncaught RangeError: Maximum call stack size exceeded
          return getValue("Jan", in1Row) + getValue("Jan", in2Row);
        }
        ...
        return data.Jan;
      }
    },
    ...
  },
};

这不起作用并getValue("Jan", in1Row) + getValue("Jan", in2Row)导致Uncaught RangeError: Maximum call stack size exceeded.

感谢您提供解决此案例的任何想法/示例！

4

1 回答 1

1

目前，实现这一点的唯一可能方法和地点似乎是使用onGridReady事件，并且可以为计算的行设置值（通过rowNode.setDataValue()）。网格在此阶段包含所有数据（+ 聚合数据）。此链接有助于了解如何收集所有数据。

更好的方法是定义getRowNodeId回调

getRowNodeId: row => {
   // custom rowNodeId resolver
},

并通过数据列和 rowId（Jan、Feb 等）获取值。

这是一个简单的实现：

  onGridReady: ({ api }) => {
    const income = api.getRowNode('row-group-0');
    const in1Row = api.getRowNode('IncomeIn 1');
    const in2Row = api.getRowNode('IncomeIn 2');
    const liabilities = api.getRowNode('Liabilities');
    
    api.forEachNode(rowNode => console.log(rowNode.id));

    for (const col of ["Jan", "Feb"]) {
      const netIncome = api.getValue(col, in1Row) + api.getValue(col, in2Row) - api.getValue(col, liabilities);
      const netIncomeTotal = api.getValue(col, income) - api.getValue(col, liabilities);

      const netIncomeRow = api.getRowNode('Net Income');
      netIncomeRow.setDataValue(col, netIncome);

      const netIncomeTotalRow = api.getRowNode('Net Income Total');
      netIncomeTotalRow.setDataValue(col, netIncomeTotal);
    }
  }

参考 plunker HERE。

于 2021-12-20T15:33:13.657 回答