使用外部按钮在 ng-grid 中清除分组

Question

我有一个 ng-grid，其中的数据按类别分组，如下所示：

$scope.gridOptions = {
  columnDefs: [
    {field: 'cat', displayName: 'Category'},
    {field: 'name', displayName: 'Name'},
    {field: 'val', displayName: 'Value'}
  ],
  data: 'myData',
  groups: ['cat']
}

我希望能够通过一个按钮在外部取消分组 ng-grid 中的数据。我不想显示组面板（通过$scope.gridOptions.showGroupPanel: true），它提供了一个“X”来清除分组。

单击外部按钮时，我尝试执行以下操作，但没有成功：

• $scope.gridOptions.groups = [];
• $scope.gridOptions.groups.length = 0

关于如何清除分组有什么建议吗？最终，我希望能够使用按钮打开/关闭分组；但是，清除分组似乎是很好的第一步。感谢您的帮助！

这是Fiddle

Answer 1

源代码中有一个未记录的函数，用于以编程方式设置组。你可以简单地：

gridOptions.groupBy(columnFieldKey)

不幸的是，我无法找到一种方法以编程方式一次按多个列进行分组。

Answer 2

您可以通过一系列 group by 语句将列添加到现有的分组列。

gridOptions.groupBy(col1);
gridOptions.groupBy(col2);

您可以通过

清除现有组

gridOptions.groupBy(null);