如何在ag-grid-angular中扩展第一个组级别

Question

我有一个 ag-grid，默认情况下行按两列分组，但这些组是折叠的。

colDefs = 
[
  {
    field: 'colA',
    rowGroupIndex: 0,
  },
  {
    field: 'colB',
    rowGroupIndex: 1
  },
  …
];

我想把第一个组级别扩展成这样：

- ColA 1
  + COlB 1 (5)
  + ColB 2 (3)
- ColA 2
  + COlB 3 (1)
  + COlB 4 (9)
  + COlB 5 (11)

一级群扩容的最佳地点在哪里？

Answer 1

看看我创建的插件：ag-grid: expand groups in ag-grid-angular

this.gridApi.expandAll();

有关更多参考，请查看文档：Built In Menu Items

expandAll: Expand all groups. Only shown if grouping by at least one column.

更新：

以上点展开了各级节点。以下解决方案是根据您的需要实现的。

看看我创建的另一个 plunk：ag-grid: expand the first group level in ag-grid-angular

我只是以编程方式扩展 0 级别的节点。

this.gridApi.forEachNode((node, b) => {
  if (node.level === 0) {
    node.setExpanded(true);
  }
});

Answer 2

除了 Paritosh 的回答：

不要使用超时，有一个事件叫做firstDataRendered，它会在需要的时间执行。

Answer 3

您可以使用 groupDefaultExpanded 选项： https://www.ag-grid.com/javascript-grid-grouping/（我不能 link 直接到该部分，而是搜索 groupDefaultExpanded）。将其设置为 0 表示所有折叠，1 表示仅第一级，等等。设置为 -1 以展开所有内容。

在您的情况下，将其设置为 1 以查看级别 1 上的项目（即仅展开顶层）

<ag-grid-angular [groupDefaultExpanded]="1">
</ag-grid-angular>

Answer 4

使用 forEachNode 的另一个选项是匹配 field 名称并使用 setRowNodeExpanded。

gridApi.forEachNode(rowNode => {
    if (rowNode.field == 'colA')
        gridApi.setRowNodeExpanded(rowNode, true)       
});

如何在ag-grid-angular中扩展第一个组级别

How to expand the first group level in ag-grid-angular

ag-grid

ag-grid-angular

更新：