我正在努力实现Google的搜索引擎等分页概念。从我目前的代码来看,除了分页的编号外,一切正常。
我想要达到的目标是限制为5.例如:
< | 1 | 2 | 3 | 4 | 5 | >
< | 4 | 5 | 6 | 7 | 8 | >
截至上述示例,每次数字超出边界时,它应更新为新的起始编号,限制为5.
HTML
<ul class="pagination">
<li ng-class="{'disabled': vm.current_page == 1,'waves-effect': vm.current_page != 1}" ng-click="vm.previous_user_page()">
<a><i class="material-icons">chevron_left</i></a>
</li>
<li ng-repeat="i in vm.pagination_number(vm.number) | limitTo: 5 | startFrom: vm.current_page - 3 track by $index" class="waves-effect" ng-class="{active: $index+1 == vm.current_page}" ng-click="vm.display_user($index+1)">
<a>{{$index+1}}</a>
</li>
<li ng-class="{disabled: vm.current_page == vm.number,'waves-effect': vm.current_page != vm.number}" ng-click="vm.next_user_page()">
<a><i class="material-icons">chevron_right</i></a>
</li>
</ul>
JS
angular
.module('app')
.controller('AdminUserController', AdminUserController)
.filter('startFrom', function() {
return function(input, start) {
if (!input || !input.length) { return; }
start = +start; //parse to int
return input.slice(start);
}
});
AdminUserController.$inject = ['$rootScope','Pagination','$scope'];
function AdminUserController($rootScope,Pagination,$scope) {
var vm = this;
vm.pagination_number = pagination_number;
vm.display_user = display_user;
vm.number = 0;
vm.users = [];
vm.current_page = 1;
vm.size = 1;
vm.limit = 4;
vm.next_user_page = next_user_page;
vm.previous_user_page = previous_user_page;
$rootScope.user_menu = [{name:'Profile',path:'profile'},{name:'Setting',path:'setting'},{name:'Home',path:''}];
$rootScope.home_default = false;
Math.ceil(1.4)
$scope.$on('$viewContentLoaded', function(){
Pagination.get({page : 1, size:vm.size},function(res){
vm.users = (res.response);
});
Pagination.get(function(res){
vm.number = ( Math.ceil(res.response/vm.size));
});
})
function pagination_number(number){
return new Array(number);
}
function display_user(page){
vm.current_page = page;
Pagination.get({page : page, size:vm.size},function(res){
vm.users = (res.response);
});
}
function next_user_page(){
if(vm.current_page < vm.number){
var page = vm.current_page + 1;
Pagination.get({page : page, size:vm.size},function(res){
vm.users = (res.response);
vm.current_page = page;
});
}
}
function previous_user_page(){
if(vm.current_page > 1){
var page = vm.current_page - 1;
Pagination.get({page : page, size:vm.size},function(res){
vm.users = (res.response);
vm.current_page = page
});
}
}
}
根据我目前的进展,startFrom过滤器正在发生变化。我做错了什么。?