anglarJs分页

首先在页面引入分页插件

<script src="../plugins/angularjs/pagination.js"></script>
<link rel="stylesheet" href="../plugins/angularjs/pagination.css">

然后再挂载到模块上:

var app=angular.module('app',['pagination']);

在表格最底下加入:

<!-- 分页 -->
<tm-pagination conf="paginationConf"></tm-pagination>

这样就完成了,需要配置paginationConf,以及相关js

/重新加载列表 数据
$scope.reloadList=function(){
//切换页码
$scope.findPage( $scope.paginationConf.currentPage,
$scope.paginationConf.itemsPerPage);
}
//分页控件配置
$scope.paginationConf = {
currentPage: 1,
totalItems: 10,
itemsPerPage: 10,
perPageOptions: [10, 20, 30, 40, 50],
onChange: function(){
$scope.reloadList();//重新加载
}
};
//分页
$scope.findPage=function(page,rows){

$http.get('../brand/findPage.do?page='+page+'&rows='+rows).success(
function(response){
$scope.list=response.rows; 
$scope.paginationConf.totalItems=response.total;//更新总记录数
} 
);
}

 

paginationConf 变量各属性的意义：
currentPage：当前页码
totalItems:总条数
itemsPerPage:
perPageOptions：页码选项
onChange：更改页面时触发事件