var app = angular.module('qingwei', ['ui.router', 'oc.lazyLoad']); app.directive('myPage', function() { return { restrict: 'AE', scope: { tableData: '=', currentPageData: '=' }, link: function(scope, element, attr) { scope.clickPage = false; scope.$watch('tableData', function (newVal, oldVal) { if (newVal == oldVal) { return; } layer.load(1); renderPage(); }, true); function renderPage() { laypage.render({ elem: attr.id //注意,这里的 test1 是 ID,不用加 # 号 ,count: scope.tableData.length //数据总数,从服务端得到 ,limit : 10 ,layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip'] ,jump: function(obj, first) { //当前页 var currentPage = obj.curr; //每页显示条数 var limit = obj.limit; scope.currentPageData = getCurrentData(currentPage, limit, scope.tableData.length); if(!scope.$$phase && !scope.$root.$$phase){ scope.$apply(); } layer.closeAll(); } }); } /** * @param currentPage 当前页码 * @param pageSize 每页size * @param total 总数 * @returns {string} */ function getCurrentData(currentPage, pageSize, total) { var currentPage = parseInt(currentPage); var total = parseInt(total); var from = (currentPage - 1) * pageSize; var to = from + pageSize; //边界处理 if (from <= 0) { from = 0; to = from + pageSize; if (to > total) { to = total; } } if (to > total) { from = to - pageSize; to = total; if (from <= 0) { from = 0; } } return scope.tableData.slice(from, to); } } }; })
<my-page table-data="blackheadFileList" id="mytable" current-page-data="currentPageData"></my-page>