加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

layer分页指令

发布时间:2020-12-17 08:54:07 所属栏目:安全 来源:网络整理
导读:一个基于layer写的分页指令 html代码: div lay-pages id="page_bar" data-options="url: 'notice/query.do',callback: 'getPageDataList',pageColor: '#12bdce',pageSize: '10',groups:'3',isSkip: false" style="margin-right: 250px;"/div js里面callback

一个基于layer写的分页指令

html代码:

<div lay-pages id="page_bar"  data-options="url: 'notice/query.do',callback: 'getPageDataList',pageColor: '#12bdce',pageSize: '10',groups:'3',isSkip: false" style="margin-right: 250px;"></div>

js里面callback函数:
//获得当前页面数据信息(用于分页指令回调)
	$scope.getPageDataList = function (dataList){
		 $scope.noticeList = dataList;
		 if($scope.noticeList.length > 0) {
				$scope.selectNotice = $scope.noticeList[0];
		}
	}

指令代码:
App.directive("layPages",['$rootScope','$compile','Page',function($rootScope,$compile,Page) {  
	   return {  
		   restrict:'AE',link: function (scope,elem,attrs) {
	    	   var page_id = attrs.id;
	    	   var options =eval('[{' + (attrs.options || '') + '}]')[0]
	    	   var url = options.url;// 数据接口
	    	   var page_color =options.pageColor;// 颜色
	    	   var page_groups = options.groups;// 连续分页数
	    	   var page_size = options.pageSize;// 每页显示条数
	    	   var page_is_skip = options.isSkip;// 是否开启跳页
	    	   var callbackFun = scope.$eval(options.callback);// 回调函数
	    	   if(!callbackFun || !typeof(callbackFun)=='function'){  
    			 return;
                   } 
	    	   var page_index = 0;
	    	   
	    	   var param = {};
	    	   param._pageIndex = page_index;
	    	   param._pageSize = page_size;
	    	   Page.ajaxPost(url,param,function (resp) {
	    		   var dataList = resp.data.rows;
    			   callbackFun(dataList); // 回调 
			   var total = resp.data.total;// 总页数
			   var total_pages = total % page_size == 0? total / pageSize: total / page_size + 1;
			   laypage({
				     cont : page_id,pages : total_pages,// 得到总页数
				     skin : page_color,skip : page_is_skip,// 是否开启跳页
				     prev : false,// 若不显示,设置false即可
				     next : false,// 若不显示,设置false即可
				     groups : page_groups,// 连续分页数
				     curr: 1,// 初始化当前页
				     jump : function(obj,first) {// 触发分页后的回调
				     /*obj是一个object类型。包括了分页的所有配置信息。
				     first一个Boolean类,检测页面是否初始加载。非常有用,可避免无限刷新。*/
					if(!first){
						param._pageIndex = obj.curr - 1;
						Page.ajaxPost(url,function(resp) {
						var dataList = resp.data.rows;
						callbackFun(dataList);// 回调  
							});
					   }
				    }
				})
			    });
   			}
   		}
}]); 
		  

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读