删除 ag 网格中的叶级行答案

【问题标题】：Remove leaf level row in ag grid删除 ag 网格中的叶级行
【发布时间】：2020-11-16 12:13:14
【问题描述】：

我有一个要求，我需要在 ag 网格中删除/隐藏叶级记录，因为它向最终用户显示了令人困惑的行为。如屏幕截图所示，我需要删除/隐藏每个组中的最后一条记录（以红色突出显示），因为它上面的记录描述了相同的数据。

我曾尝试像这样使用 updateRowData 删除：

 this.gridApi.forEachLeafNode(function(rowNode, index) {
     self.gridApi.updateRowData({ remove: [rowNode.data] });
   });

上面的代码删除了所有数据，因为在我的例子中，第 2 层和第 3（叶）层中显示的数据是相同的。无论如何我只能删除标记为红色的那个。

我还尝试了其他技术，例如按照文档建议将数据添加到叶级记录，但没有任何效果。

PS：删除可能不是唯一的选择。如果可以不渲染，那么也将满足要求。任何指导都会有所帮助

【问题讨论】：

标签： javascript ag-grid ag-grid-angular

【解决方案1】：

不确定它是否是最好的，但这里有一个解决方案。

假设您有类似这样的网格模板

<ag-grid-angular
  #agGrid
  [rowData]="rowData"
  ... // snip!
  [getDataPath]="getDataPath"  // This one is key
  (gridReady)="onGridReady($event)"
></ag-grid-angular>

还有这样的数据：

this.rowData = [
  { entry: ['A'] },
  {
    entry: ['A', 'B'],
  },
  {
    entry: ['C', 'D'],
  },
  {
    entry: ['E', 'F', 'G', 'H'],
  },
];

稍后当你声明函数时：

this.getDataPath = function(data) {
  // This returns the hiarchy normally
  return data.entry;     
};

但是如果我们可以稍微修改一下呢？

this.getDataPath = function(data) {
  // If there are more than two levels, we'll just slice those off.        
  if( data.entry.length > 2 ) {
    return data.entry.slice(0,2);
  }
  return data.entry;
};

当然，我们可以在切片之前比较值或过滤。

（我几乎没有接触过 Angular，但我从这里 https://www.ag-grid.com/javascript-grid-tree-data/ 关注了 plunker 链接并进行了一些简单的编辑。）

【讨论】：

好的。看起来是个好主意。我会试一试，让你知道。感谢您的回复和建议..
如果我们有 gridOptions.treeData = true ，看起来这个解决方案会起作用。在我的情况下，gridOptions.treeData = false，如果我将其设为 true，它将使实现变得复杂并改变整个设计。
我的错误，我从图像中假设您使用的是treeData。
很抱歉没有提供该信息。对这种情况有什么想法吗？

【解决方案2】：

您会发现，如果按照here 的说明启用 Pivoting，它将不再显示最终的叶节点。然而，切换到 PivotMode 有很多副作用，您应该对其进行测试。

【讨论】：