Javascript 如何实现angularJS分页
我面临分页问题。我尝试了几个答案,包括自定义过滤器,每次都不显示数据。我知道数据已被提取,并且在DOM中存在,但我似乎不明白为什么它不显示数据 分页控件:Javascript 如何实现angularJS分页,javascript,jquery,angularjs,pagination,angularjs-ng-repeat,Javascript,Jquery,Angularjs,Pagination,Angularjs Ng Repeat,我面临分页问题。我尝试了几个答案,包括自定义过滤器,每次都不显示数据。我知道数据已被提取,并且在DOM中存在,但我似乎不明白为什么它不显示数据 分页控件: // pagination controls $scope.currentPage = 1; $scope.totalItems = $scope.searchDataValues.length; $scope.entryLimit = 8; // items per page $scope.noOfPages
// pagination controls
$scope.currentPage = 1;
$scope.totalItems = $scope.searchDataValues.length;
$scope.entryLimit = 8; // items per page
$scope.noOfPages = Math.ceil($scope.totalItems / $scope.entryLimit);
$scope.pageChanged = pageChanged;
$scope.paginatedList = $scope.searchDataValues.slice(0, $scope.entryLimit);
function pageChanged(){
var begin = (($scope.currentPage - 1) * $scope.entryLimit),
end = begin + $scope.entryLimit;
$scope.paginatedList = $scope.searchDataValues.slice(begin, end);
}
HTML端代码:
<pagination
ng-change="pageChanged()"
total-items="totalItems"
items-per-page="entryLimit"
ng-model="currentPage"
max-size="noOfPages"
class="pagination-sm"
boundary-links="true">
</pagination>
您可以使用ui引导分页指令。 我使用的是旧版本,所以语法可能有点不同。
这是一个猜测:pageChanged函数更改$scope.paginatedList,但ng repeat绑定到searchDataValues而不是paginatedList
这可能是您的问题的根源,但这只是一个猜测,因为您没有提供所有的代码。对于任何来这里阅读本文的人 我最终使用了这里的代码:
我确实工作过,但它破坏了我的排序功能。我会尽力让他们两个一起工作 谢谢你的建议,我最终使用了:。但它破坏了我的排序功能。现在我得想办法让他们两个好好地玩一玩。
<tr ng-repeat="data in searchDataValues | orderBy:sortKey:reverse | startFrom:(currentPage-1)*entryLimit | limitTo:entryLimit ">
app.filter('startFrom', function () {
return function (input, start) {
if (input === undefined || input === null || input.length === 0) return [];
start = +start; //parse to int
console.log(input.slice(start))
return input.slice(start);
}
});