javascript – AngularJS分页顺序只影响显示页面

任何人都可以指出我正确的方向,找出一种方法解决分页和orderBy在角色中的合作方式?

目前,我可以订购并浏览数据[]的结果,但是orderBy过滤器只会单独影响每个页面.

例如,如果我按照相反的顺序排列ID,则页面1将列出10-1,第2页将列出15-11,而不是从第15页开始,到第二页的末尾.

在这里一个基本的小提琴http://jsfiddle.net/ZbMsR/

这是我的控制器:

function MyCtrl($scope) {
    $scope.currentPage = 0;
    $scope.pageSize = 10;
    $scope.orderBy = "-appId";
    $scope.data = [
        {'appId': 1},{'appId': 2},{'appId': 3},{'appId': 4},{'appId': 5},{'appId': 6},{'appId': 7},{'appId': 8},{'appId': 9},{'appId': 10},{'appId': 11},{'appId': 12},{'appId': 13},{'appId': 14},{'appId': 15}
];

    $scope.numberOfPages=function(){
        return Math.ceil($scope.data.length/$scope.pageSize);                
    };
}

//We already have a limitTo filter built-in to angular,//let's make a startFrom filter
app.filter('startFrom',function() {
    return function(input,start) {
        start = +start; //parse to int
        return input.slice(start);
    }
});

这是我的视图的相关部分

<strong>Sort By:</strong> <a ng-click="orderBy = 'appId'; reverse=!reverse">Newest</a>
 <ul>
    <li ng-repeat="item in data | startFrom:currentPage*pageSize | limitTo:pageSize | orderBy:orderBy:reverse">
        {{item.appId}}
    </li>
 </ul>

解决方法

如果您有完整的客户端分页,那么您只需更改过滤器的顺序即可:
<li ng-repeat="item in data | orderBy:orderBy:reverse | startFrom:currentPage*pageSize | limitTo:pageSize ">

这是你预期的吗

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...