2015-12-05 53 views
0

嗨,我想我們如果你能指出我的Angularjs UI Bootstrap分頁的正確示例代碼來定製模板?Angularjs UI.Bootstrap分頁自定義模板?

我試過在谷歌和這裏在stackoverflow搜索,但我找不到任何正確的例子或解釋如何使用模板url分頁這個功能組件。

https://angular-ui.github.io/bootstrap/#/pagination

我想緩存模板 「模板/分頁/ pagination.html」 更改爲類似這樣一個

<script type="text/ng-template" id="custompagination.html"> 
 
code here... 
 
</script>

,但它給了我一個錯誤。如果您有我可以在線閱讀的樣本或提示,請告訴我。

感謝,

回答

0

你應該只能夠在HTML來定義您的自定義模板如下:

<script type="text/ng-template" id="template/pagination/pagination.html"> 
    <div class="pager"> 
    <div class="page" ng-click="selectPage(page.number)" ng-repeat="page in pages" ng-class="{active: page.active, disabled: page.disabled}">{{page.text}}</div> 
    </div> 
</script> 

和一些CSS來(如果需要)風格:

div.page { 
    float:left; 
    background-color: #cccccc; 
    width:20px; 
    height:20px; 
} 

div.active { 
    font-weight: bold; 
    background-color: #ffffff; 
} 

您可以使用script指令覆蓋模板。因爲它具有與默認Bootstrap分頁模板相同的ID,所以它會覆蓋它。演示請參閱here