本插件的開發目的主要給前端同學使用，本人是專註於後臺開發的，對css樣式不熟悉，但逼於前端要求做一個共公組件方便日常開發，所以這個插件在樣式上可能不適合大部分人，喜歡的拿走吧，不喜歡的也請別噴。

一、使用環境

　　1.Angularjs 1.x

　　2.Bootstrap 3

　在自己的環境裏請自行配置js和css，本文不作這方面的介紹。

二、效果圖

　　效果邏輯：

　　　　1.當前頁碼默認選中高亮狀態

　　　　2.頁碼少於等於1，則“上一頁”為不可點擊狀態

　　　　3.頁碼大於等於最大頁碼，則“下一頁”為不可點擊狀態

　　　　4.頁碼輸入框的範圍是 1~最大頁碼，當超過最大頁碼時，“確定”按鈕不可點

　　　　5.如果總記錄數不存在或少於1，則整個插件不顯示任何效果

三、使用步驟

　　1.下載文件：etgyd.pagination.min.js 添加到頁面裏

<script type="text/javascript" src="etgyd.pagination.min.js"></script>

　　2.Angularjs 添加引用

angular.module(‘Webapp‘, [‘etgyd.pagination‘]);

　　3.html裏使用本指令

<div>
    <etgyd-pagination page-model="pagevo" page-control="pageConfig" call-function="queryPage(pagevo.pageNum)" ></etgyd-pagination>
</div>

　　參數說明：　

 {
   pageNum: 1,//當前頁碼
   pageSize: 10,//每頁大小
   total: 200,//總記錄數
   pages: 20,//總頁數,允許為空
   pagesLength: 5//顯示分頁按鈕數，必須為奇數，默認為5，允許為空
 
}

開放的api，目前只有extent()

$scope.pageConfig.extent()

回調方法，可以自定義查詢，此處會返回點擊的頁碼

$scope.queryPage=function(num){

    $scope.query("",num);
}

　　4.controller的實現

　　 這裏需要定義兩個方法 1、上面所提到的回調方法$scope.queryPage 2、與服務器交互的查詢方法 $scope.query

　　$scope.queryPage接收的參數為指令返回的，固定為pageNum

　　$scope.query 實現如下，大家可以自行修改，以下只是我的實現，其中有兩個地方需要註意，分頁對象必須要聲明，聲明後要延時執行指令，時間最好大於200ms，我這裏寫的是1秒後執行

整個指令的使用就是以上這些，很久沒有寫博客了，這次也算是在學習了一天後的少少分享，可能有些地方寫得不太好，歡迎留言！

Angularjs+Bootstrap實現分頁指令