AngularJS分页实现报错：orderBy:notarray 预期数组却收到对象

先聊聊你遇到的这个报错的核心原因：

Error: [orderBy:notarray] Expected array but received: {"name":"Micro biology",...}

这个提示已经说得很清楚了——orderBy过滤器要求传入的是数组，但你当前传给它的是单个对象。看你写的ng-repeat代码：

<tr ng-repeat="skillTestsData in data.skillTests[currentPage] | orderBy:sortingOrder:reverse">

这里的data.skillTests[currentPage]取到的是你原始数组里的第currentPage个元素（也就是单个对象），完全不符合orderBy的要求。

再看你的客户端脚本，其实你已经把分页处理好的数据存在了$scope.pagedItems里，这才是应该绑定到ng-repeat的分页数据源！

具体修复步骤： #

1. 修正ng-repeat的数据源
   把HTML里的data.skillTests[currentPage]替换成pagedItems[currentPage]，因为pagedItems是你通过groupToPages()方法拆分好的、按页分组的数组集合，每一项都是对应页码的完整数组：

<tr ng-repeat="skillTestsData in pagedItems[currentPage] | orderBy:sortingOrder:reverse">

2. 修复排序逻辑的小问题
   看你的sort_by方法里，有两个需要调整的地方：
   • 变量名拼写错误：你用了未定义的new_sorting_order，应该改成参数newSortingOrder
   • 排序变化后未重新触发分页：建议在方法末尾加上$scope.search()，确保排序后数据能重新过滤、分组
     修改后的代码：

$scope.sort_by = function(newSortingOrder) {
    if ($scope.sortingOrder == newSortingOrder)
        $scope.reverse = !$scope.reverse;
    $scope.sortingOrder = newSortingOrder;
    // icon setup
    $('th i').each(function(){
        // icon reset
        $(this).removeClass().addClass('icon-sort');
    });
    if ($scope.reverse)
        $('th.'+newSortingOrder+' i').removeClass().addClass('icon-chevron-up');
    else
        $('th.'+newSortingOrder+' i').removeClass().addClass('icon-chevron-down');
    // 新增：排序变化后重新执行分页逻辑
    $scope.search();
};

3. 确认初始化逻辑正常
   你的脚本最后已经调用了$scope.search()，这会自动初始化filteredItems和pagedItems，所以只要数据源改对，页面加载时就能正确渲染第一页的数组数据。

这样修改后，orderBy就能拿到符合要求的数组，报错会直接消失，分页和排序功能也能正常工作啦！

内容的提问来源于stack exchange，提问作者Mr world wide