2015-03-25 123 views
1

我正在編輯應用程序的用戶界面,有一個現有的分頁設計。現在我想要改變分頁的導航。Angular Bootstrap分頁:添加自定義類到導航按鈕

這是我的分頁代碼:

<div pagination="" total-items="merchandisesCount" page="currentPage" items-per-page="rowsPerPage" 
    max-size="maxSize" class="pagination-sm" boundary-links="true" rotate="false" num-pages="numPages" 
    next-text="" previous-text="" first-text="" last-text=""></div> 

當分頁顯示,我要添加的字體真棒字形左,右等,用作我的導航。我該怎麼做?

感謝

回答

2

我不知道,如果你解決你的問題,但我有同樣的問題,發現這對方的回答:How to set prevous-text and next-text attribute as HTML template in angular-ui bootstrap pagination directive

我以前提供的解決方案,但它有一些問題,所以我將其更改爲:

<pagination total-items="pagination.totalItems" items-per-page="pagination.itemsPerPage" page="pagination.currentPage" boundary-links="true" rotate="false" max-size="5" on-select-page="getAnnouncements(page)"></pagination> 

<script id="template/pagination/pagination.html" type="text/ng-template"> 
    <ul class="pagination"> 
     <li ng-repeat="page in pages" ng-class="{active: page.active}"> 
      <a href data-ng-show="page.text == 'Previous'" ng-click="selectPage(page.number)"> <i class="fa fa-chevron-left"></i> </a> 
      <a href data-ng-show="page.text >= 1 || page.text == 'First' || page.text == 'Last'" ng-click="selectPage(page.number)">{{page.text}}</a> 
      <a href data-ng-show="page.text == 'Next'" ng-click="selectPage(page.number)"> <i class="fa fa-chevron-right"></i> </a> 
     </li> 
    </ul> 
</script> 

我希望這會對您有所幫助。