首先感謝琛哥的耐心講解矾瑰,恕己愚鈍。若有不足隘擎,歡迎斧正殴穴。
分頁(yè)在地市報(bào)中很常見(jiàn),現(xiàn)總結(jié)一下货葬,以供參考采幌。(綠色框內(nèi)的即是分頁(yè))
分頁(yè)
<div class="page cls-paging">
<trs-pagenation-left page-count="page" callback="selectPageNum()" is-select-pagecount="false"></trs-pagenation-left>
<pagination total-items="page.ITEMCOUNT" ng-change="pageChanged()" ng-model="page.CURRPAGE" max-size="6" class="pagination-sm page_left" boundary-links="true" items-per-page="page.PAGESIZE" rotate="false" num-pages="page.PAGECOUNT" first-text="首頁(yè)" previous-text="上一頁(yè)"
next-text="下一頁(yè)" last-text="末頁(yè)"></pagination>
<trs-pagenation-right callback="jumpToPage()" currpage="data.copyCurrPage" page="page"></trs-pagenation-right>
</div>
分頁(yè)是個(gè)指令,上面的代碼即是引用該指令的html代碼
分頁(yè)中重要的四個(gè)參數(shù):
CURRPAGE 當(dāng)前頁(yè)震桶,即可點(diǎn)擊的數(shù)字頁(yè)數(shù)1,2,3,4,5...
PAGESIZE 單頁(yè)顯示數(shù)據(jù)個(gè)數(shù)
ITEMCOUNT 數(shù)據(jù)總個(gè)數(shù)
-
PAGECOUNT 總頁(yè)數(shù)
下面的代碼即是分頁(yè)對(duì)應(yīng)的三個(gè)方法: /** * [selectPageNum description]選擇分頁(yè)條數(shù) * @return {[type]} [description] */ $scope.selectPageNum = function() { $scope.data.copyCurrPage = 1; initData(); }; /** * [pageChanged description]跳轉(zhuǎn)到下一頁(yè) * @return {[type]} [description] */ $scope.pageChanged = function() { params.pageNum = $scope.page.CURRPAGE; $scope.data.copyCurrPage = $scope.page.CURRPAGE; initData(); }; /** * [jumpToPage description]跳轉(zhuǎn)到指定頁(yè) * @return {[type]} [description] */ $scope.jumpToPage = function() { if ($scope.data.copyCurrPage > $scope.page.PAGECOUNT) { $scope.data.copyCurrPage = $scope.page.PAGECOUNT; } params.pageNum = $scope.data.copyCurrPage; initData(); };
- callback="selectPageNum()" 選擇單頁(yè)顯示的數(shù)據(jù)個(gè)數(shù)休傍,is-select-pagecount="false"配置選擇單頁(yè)顯示個(gè)數(shù)是否可用,true表示可用蹲姐,false表示不可用磨取。
- ng-change="pageChanged()" 當(dāng)分頁(yè)改變時(shí)執(zhí)行該方法人柿,params.pageNum中的pageNum是后臺(tái)所需的頁(yè)碼參數(shù)。$scope.data.copyCurrPage = $scope.page.CURRPAGE忙厌,這一句是為了在跳轉(zhuǎn)輸入框輸入頁(yè)碼但還沒(méi)有點(diǎn)擊跳轉(zhuǎn)時(shí)防止頁(yè)碼跟著變化凫岖。
- callback="jumpToPage()" 這一句是在頁(yè)碼跳轉(zhuǎn)框內(nèi)輸入頁(yè)碼點(diǎn)擊跳轉(zhuǎn)時(shí)執(zhí)行,if判斷是當(dāng)輸入頁(yè)碼大于總頁(yè)碼時(shí)逢净,讓輸入頁(yè)碼取最大頁(yè)碼值哥放。