AngularUI grid：排序后如何获取按排序顺序排列的已选数据？

我之前也踩过这个坑！AngularUI Grid 1.x的getSelectedRows()方法确实只会返回原始数据顺序的选中行，因为它内部是直接从数据源数组里标记选中状态，完全不关联视图层的排序、过滤结果。要拿到和当前表格显示顺序一致的选中行，得换个思路——从视图渲染的行集合里筛选选中项。

核心解决方案 #

直接从网格的renderedRows（已排序/过滤后的视图行集合）中提取选中的行数据，步骤如下：

1. 获取当前网格中已经渲染的所有行（这个集合就是按照你设置的排序规则排列的）
2. 筛选出其中isSelected为true的行
3. 提取这些行对应的实体数据（行对象的entity属性就是你绑定的原始数据）

代码示例 #

假设你的Grid API已经通过onRegisterApi挂载到了$scope.gridApi上，可以写一个工具函数来实现：

// 获取排序后的选中行数据
$scope.getSortedSelectedRows = function() {
  // 获取当前可见的已渲染行（已排序）
  const visibleRenderedRows = $scope.gridApi.core.getVisibleRows($scope.gridApi.grid);
  
  // 筛选选中行并提取实体数据
  return visibleRenderedRows
    .filter(row => row.isSelected)
    .map(row => row.entity);
};

额外说明 #

• 这个方法会实时响应视图状态：不管你是做了排序、过滤还是分页操作，返回的选中行顺序都会和当前表格显示的顺序完全一致。
• 如果是跨分页的全选场景，getVisibleRows()只会返回当前页的行，要是需要全部分页的选中行并按排序后的顺序排列，你可以先获取所有行（$scope.gridApi.grid.rows），再根据网格的排序规则手动排序后筛选选中项，但这种情况需要额外处理排序逻辑，不如直接用renderedRows符合用户的直观预期。
• 确保在Grid初始化完成后调用这个方法，比如可以在gridApi.core.on.renderingComplete事件回调里执行，避免出现gridApi未定义的问题。

内容的提问来源于stack exchange，提问作者Prashanth