Question

您好我想告诉我们您是否可以为我指出Angularjs UI Bootstrap Pagination的正确示例代码来自定义模板？

我尝试搜索谷歌和这里的stackoverflow但我找不到任何正确的例子或解释如何使用template-url为这个功能组件分页。

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

我想将缓存模板“template / pagination / pagination.html”更改为类似这样的

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

但它给了我一个错误。如果您有我可以在线阅读的样本或提示，请告诉我。

谢谢，

Answer 1

您应该能够在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。

Angularjs UI.Bootstrap分页自定义模板？

1 个答案: