//
//
//
'use strict';
//
angular.module('pagination', []).directive("pagination", function() {
//
return {
restrict: 'EA',
replace: true,
scope: {
option: '=pageOption',
query: '&',
pageable: '='
},
template: '<div class="row navigation_box" style="padding:15px">' +
' <div class="pull-right">' +
' <ul class="pagination">' +
' <li><span><span ng-bind="$root.i18n.total_elements">总数</span>:<b ng-bind="option.totalElements"></b></span></li>' +
' <li><span><span ng-bind="$root.i18n.total_page">页数</span>:<b ng-bind="option.totalPages"></b></span></li>' +
' </ul>' +
' </div>' +
' <div class="pull-right" style="margin-right: 26px">' +
' <nav aria-label="Page navigation">' +
' <ul class="pagination">' +
' <!-- 当前 加active 不能点击 disabled -->' +
' <li class="first" ng-class="isFirst() && \'disabled\'"><a href="javascript:void(0)" ng-click="pre()" ng-bind="$root.i18n.previous_page">上一页</a></li>' +
' <li ng-repeat="p in page" ng-class="option.number==(p -1) && \'active\'"><a href="javascript:void(0)" ng-click="pageClick(p)">{{p}}</a></li>' +
' <li class="last" ng-class="isLast() && \'disabled\'"><a href="javascript:void(0)" ng-click="next()" ng-bind="$root.i18n.next_page">下一页</a></li>' +
' </ul>' +
' </nav>' +
' </div>' +
'</div>',
link: function($scope) {
//
$scope.option.$promise.then(function() {
//
//得到显示页数的数组
$scope.page = getRange($scope.option.number, $scope.option.totalPages, 5);
//
$scope.isFirst = isFirst;
//
$scope.isLast = isLast;
})
//
function isFirst() {
return $scope.option.number === 0;
}
//
function isLast() {
return $scope.option.totalPages === 0 || $scope.option.number == $scope.option.totalPages - 1;
}
//
$scope.pre = function() {
$scope.pageClick('上一页');
}
$scope.next = function() {
$scope.pageClick('下一页');
}
//绑定点击事件
$scope.pageClick = function(page) {
if (page == '上一页') {
if (isFirst()) {
return;
}
page = parseInt($scope.option.number) - 1;
} else if (page == '下一页') {
if (isLast()) {
return;
}
page = parseInt($scope.option.number) + 1;
} else {
page -= 1;
}
if (page < 1) {
page = 0;
} else if (page > $scope.option.totalPages) {
page = $scope.option.totalPages - 1;
}
//点击相同的页数 不执行点击事件
if (page == $scope.option.number) {
return;
}
//
$scope.option.number = page;
$scope.pageable.page = page;
//
$scope.query()
//
$scope.page = getRange($scope.option.number, $scope.option.totalPages, 5);
}
//返回页数范围（用来遍历）
function getRange(curr, all, count) {
//计算显示的页数
curr = parseInt(curr) + 1;
all = parseInt(all);
count = parseInt(count);
var from = curr - parseInt(count / 2);
var to = curr + parseInt(count / 2) + (count % 2) - 1;
//显示的页数容处理
if (from <= 0) {
from = 1;
to = from + count - 1;
if (to > all) {
to = all;
}
}
if (to > all) {
to = all;
from = to - count + 1;
if (from <= 0) {
from = 1;
}
}
var range = [];
for (var i = from; i <= to; i++) {
range.push(i);
}
return range;
}
}
}
}) | 
转播
