Angularjs UI.Bootstrap分页自定义模板? [英] Angularjs UI.Bootstrap Pagination customizing template?
问题描述
我想问我们是否可以为Angularjs UI Bootstrap分页自定义模板提供正确的示例代码?
Hi I would like to us if there you can point me to a correct sample code for Angularjs UI Bootstrap Pagination to customize the template?
我尝试在stackoverflow中搜索google和此处,但是找不到关于如何使用template-url进行此功能组件分页的正确示例或说明.
I tried searching google and here in stackoverflow but I cannot find any correct example or explanation on how to use the template-url for pagination for this function component.
https://angular-ui.github.io/bootstrap/#/pagination
我想将缓存模板"template/pagination/pagination.html"更改为类似的内容
I want to change the cache template "template/pagination/pagination.html" to something like this one
<script type="text/ng-template" id="custompagination.html">
code here...
</script>
但是它给了我一个错误.如果您有可以在线阅读的示例或提示,请告诉我.
but it gave me an errors. If you have sample or tips that I can read online, please let me know.
谢谢
推荐答案
您应该能够按照如下所示在HTML中定义您的自定义模板:
You should just be able to define your custom template in the HTML as follows:
<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>
和一些样式样式(如果需要):
and some CSS to style (if required):
div.page {
float:left;
background-color: #cccccc;
width:20px;
height:20px;
}
div.active {
font-weight: bold;
background-color: #ffffff;
}
您可以使用脚本指令覆盖模板.由于此ID与默认的Bootstrap分页模板具有相同的ID,因此它将覆盖它.有关演示,请参见此处.
You can override a template using the script directive. Because this has the same ID as the default Bootstrap pagination template, it will override it. See here for a demo.
这篇关于Angularjs UI.Bootstrap分页自定义模板?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!