AngularJs对分组元素的分页

时间:2013-09-12 21:10:11

标签: angularjs

我正在尝试对分组列表进行分页,但是我有循环依赖的错误。

我是关于角度的新手,从SO here的其他答案中获取此代码,但无法对其进行分页。

这是一个小提琴:http://jsfiddle.net/Tropicalista/qyb6N/1/

angular.module('test', ['ui.bootstrap']);
function Main($scope, $q) {
$scope.players = [//my data]

// create a deferred object to be resolved later
var teamsDeferred = $q.defer();

// return a promise. The promise says, "I promise that I'll give you your
// data as soon as I have it (which is when I am resolved)".
$scope.teams = teamsDeferred.promise;

// create a list of unique teams
var uniqueTeams = unique($scope.players, 'team');

// resolve the deferred object with the unique teams
// this will trigger an update on the view
teamsDeferred.resolve(uniqueTeams);

// function that takes an array of objects
// and returns an array of unique valued in the object
// array for a given key.
// this really belongs in a service, not the global window scope
function unique(data, key) {
    var result = [];
    for (var i = 0; i < data.length; i++) {
        var value = data[i][key];
        if (result.indexOf(value) == -1) {
            result.push(value);
        }
    }
    $scope.noOfPages = Math.ceil(result.length / 10);
   return result;
}

$scope.currentPage = 1;
$scope.pageSize = 5; 
$scope.maxSize = 2;

}


angular.filter('startFrom', function() {
return function(input, start) {
    start = +start; //parse to int
    return input.slice(start);
}
});

1 个答案:

答案 0 :(得分:-1)

为您修复了代码。 http://jsfiddle.net/93Rd3/

您需要在应用过滤器时更改顺序。

<div ng-repeat="team in teams| startFrom:(currentPage - 1)*pageSize  | limitTo:pageSize ">

如果是undefined

,您最好检查传入过滤器的文字
app.filter('startFrom', function () {
    return function (input, start) {
        if (input === undefined || input === null || input.length === 0) return [];
        start = +start; //parse to int
        return input.slice(start);
    }
});