<ul class="payment_conditions_paging"> <li ng-click="previous_page()" ng-show="previousPage"> <img src="static/img/previous_page@2x.png" alt=""> </li> <li ng-repeat="page in pageList" ng-class="{paging_active: isActivePage(page)}" ng-click="selectPage(page)">{{page}} </li> <li class="p_last" ng-show="nextPage"> <img ng-click="p_last()" src="static/img/next_page@2x.png" alt=""> </li> </ul>
/** * post请求 * @param pagination 页数 * @param url url * @param callBack 回调函数 * @private */ function _get(pagination,url,callBack) { $http({ method: 'post', url: url, data: { "params":{ 'pagination': pagination } } }).then(function successCallback(response) { if(response.data.result_code == 0){ callBack(response); }else { alert(response.data.result_msg); } }, function errorCallback(response) { // 请求失败执行代码 }); }
$scope.membershipAccounts = function (){ $scope.pagination = 0; $scope.selPage = 1; $scope.pageList = []; // 第一页 _get(0,'dues/transactions',function (response) { $scope.accounts = response.data; $scope.accountData = response.data.paged_data; $scope.total_page = response.data.total_page; $scope.pageSize = 3; $scope.pages = Math.ceil($scope.accounts.total_data_count / $scope.pageSize); //分页数 $scope.newPages = $scope.pages > 3 ? 3 : $scope.pages; for (var i = 0; i < $scope.newPages; i++) { $scope.pageList.push(i + 1); } //当总页数超过分页数,右翻页显示 if($scope.accounts.total_page > $scope.pageSize){ $scope.nextPage = true; }else { $scope.nextPage = false; } }); // 选中某一页 $scope.selectPage = function (page) { // console.log(page); $scope.selPage = page; $scope.isActivePage(page); _get(page-1,'dues/transactions',function (response) { // console.log(response); $scope.accounts = response.data; $scope.accountData = response.data.paged_data; $scope.total_page = response.data.total_page; $scope.pageSize = 3; $scope.pages = Math.ceil($scope.accounts.total_data_count / $scope.pageSize); //分页数 $scope.newPages = $scope.pages > 3 ? 3 : $scope.pages; }); // 当前页数大于等于2时,左翻页显示 if(page >= 2){ $scope.previousPage = true; }else { $scope.previousPage = false; } //当总页数超过分页数,右翻页显示 if($scope.accounts.total_page > $scope.pageSize){ $scope.nextPage = true; }else { $scope.nextPage = false; } //当前页数大于等于总页数,右翻页隐藏 if(page >= $scope.accounts.total_page){ $scope.nextPage = false; } }; // 左翻页 $scope.previous_page = function () { $scope.selectPage($scope.selPage - 1); // console.log($scope.selPage); var newArr = []; angular.forEach($scope.pageList,function (val) { this.push(val - 1); if(val < 1){ $scope.previousPage = false; } },newArr); $scope.pageList = newArr; console.log(newArr); angular.forEach(newArr,function (val) { // console.log(val); if(newArr.length == 3 && val == 0){ newArr.splice(0,1); newArr.push(val+3); } }); }; // 右翻页效果 $scope.p_last = function () { $scope.selectPage($scope.selPage + 1); var newArr = []; angular.forEach($scope.pageList,function (val) { this.push(val + 1); if(val > $scope.accounts.total_page){ $scope.nextPage = false; } $scope.pageList = newArr; },newArr); // console.log(newArr); angular.forEach(newArr,function (val) { // console.log(val); if(newArr.length == 3 && val > $scope.accounts.total_page){ newArr.splice(2,1); newArr.unshift(val-3); } }); }; //设置当前选中页样式 $scope.isActivePage = function (page) { return $scope.selPage == page; }; };