Angular分页指令，简单配置即可使用

指令app.directive('pagination',['$http','$q',function($http,$q){return{restrict:'E',templateUrl:'./modules/business/page.html',replace:true,scope:{list:'=',//列表数据url:'@',//接口urlmethod:'@',//getorpostrequestParam:'=',//请求参数requestData:'=',//请求对象数据event:'@'//事件名称，外部调用分页查询的事件},link:function(scope,element){//监听事件范围.$on(scope.event,function(event,data){console.log(scope.event,data);scope.load数据（）;});//ajax服务varAjaxService={get:function(url,params){vardefered=$q.defer();$http({method:'GET',url:url,params:params}).success(function(data){defered.resolve(data);}).error(function(err){defered.reject(err);});返回defered.promise；},post:function(url,params,data){vardefered=$q.defer();$http({我thod:'POST',url:url,params:params,data:data}).success(function(data){defered.resolve(data);}).error(function(err){defered.reject(err);});返回defered.promise；}};//配置参数scope.conf={currentPage:1,totalPage:1,endPage:1,pageSize:15,pages:[],total:0,pageSizeList:[10,15,20,25,30,35,40,45,50]};//加载数据scope.loadData=function(){scope.requestParam=scope.requestParaminstanceofObject&&scope.requestParam||{};scope.requestData=scope.requestDatainstanceofObject&&scope.requestData||{};scope.requestParam.page=scope.conf.currentPage;scope.requestParam.pageSize=scope.conf.pageSize;变种承诺=空；如果(scope.method=='GET')promise=AjaxService.get(scope.url,scope.requestParam);elseif(scope.method=='POST')promise=AjaxService.post(scope.url,scope.requestParam,scope.requestData);promise.then(function(resp){if(resp&&resp.code==0){if(resp.result&&resp.resultinstanceofArray)scope.list=resp.res终极;否则scope.list=[];if(resp.total&&typeof(resp.total)=='number')scope.conf.total=resp.total;否则scope.conf.total=0;}scope.calcPages();});};//修改页面大小scope.changePageSize=function(n){scope.conf.pageSize=n;scope.conf.currentPage=1;作用域.loadData();};//下一页scope.next=function(){if(scope.conf.currentPage1){scope.conf.currentPage--;作用域.loadData();}};//加载指定页面scope.loadPage=function(page){if(scope.conf.currentPage!=page){scope.conf.currentPage=page;作用域.loadData();}};//查询scope.query=function(){scope.conf.currentPage=1;范围。加载数据（）；};//计算页数scope.calcPages=function(){//计算总页数scope.conf.totalPage=Math.ceil(scope.conf.total/scope.conf.pageSize);//生成快捷页码if(scope.conf.currentPage>1&&scope.conf.currentPage1){scope.conf.pages=[scope.conf.currentPage,scope.conf.currentPage+1];}elseif(scope.conf.currentPage==scope.conf.totalPage&&scope.conf.totalPage>1){scope.conf.pages=[scope.conf.currentPage-1,scope.conf.currentPage];}};//指令加载后立即查询scope.query()；}};}]);为了代码集中，我在里面定义了ajaxservice。指令中基本包含了分页需要的功能，不需要修改，下次直接引用即可。应用程序index.html示例代码中，list参数为双向绑定的列表数据，businesses为页表绑定的ng-repeat循环的list集合，url为后台接口，event为事件名称,method为接口方法，GET或POST，request-param为请求参数，request-data为请求体。controller.js//分页请求参数$scope.requestParam={};//分页请求对象（模糊查询时，对象属性可以是列表数据的字段）$scope.requestData={};/***广播通知分页命令*/$scope.query=function(){$scope.$broadcast('event-pagination-query-bp','query');};添加数据或更新数据后，可以调用controller中的query方法通知command查询页面效果