在同一页面上的两个角度ui bootstrap分页不起作用

我在同一页面上有2个角度的UI bootstrap分页，但是我的第二个分页不能正常工作。在同一页面上的两个角度ui bootstrap分页不起作用

我的第一个分页初始化：

<ul uib-pagination total-items="list_details.length" max-size="4" items-per-page="page_size" ng-model="current_page" ng-change="pageChanged()"> </ul>

这里我父DIV的一个，为PAGE_SIZE值ng-init="page_size=50"。

我的表tr是：

<tr ng-repeat="cl in list_details | limitTo: page_size:(current_page-1)*page_size"></tr>

我的第二个分页初始化：

<ul uib-pagination total-items="main_details.length" max-size="4" items-per-page="page_size_main" ng-model="current_page_main" ng-change="pageChanged()"></ul>

这里我父DIV的一个设置page_size_main值ng-init="page_size_main=50"。

我的表tr是：

<tr ng-repeat="em in main_details | limitTo: page_size_main:(current_page_main-1)*page_size_main"></tr>

现在奇怪的我的第一台拥有14个记录，第一分页工作正常。但对于第二个表格，分页按照数据长度正确创建，但表格显示所有记录。因此，第二，有58个记录，每页大小为50，第2页正在创建，但表中显示了所有58个记录，并且分页链接对于第二个表格不起作用。如果我将第一个表的页面大小10

一两件事，然后第二个表的数据进行过滤，以10，但仍然分页不工作的第二个表。这很奇怪，我没有从任何地方获得解决方案。

有人可以帮我吗？

Downvoters给出原因，以便我可以改善我的问题。

来源

2017-02-27 Mayur Patel

你是否尝试为每个分页单独设置一个“id”（当然不同）？ – lealceldeiro

这是不同的。 –

你可以创建一个[plunker]（https://plnkr.co/edit/YZ9EljLYVbgxgkNPNuBe?p=preview）吗？ – svarog

我得到了解决我的问题。这可能有助于某人，所以我张贴我自己的答案。我用包含ng-if包装的父div包裹了我的第二张表格分页。

<div ng-if="...some condition..."> 
     <ul uib-pagination total-items="main_details.length" max-size="4" items-per-page="page_size_main" ng-model="current_page_main" ng-change="pageChanged()"></ul></pagination> 
</div>

这导致我的NG-变化由当时的分页加载我的模型项目页面有一个值不射击两次，希望这可以帮助别人。

所以只需更换ng-if与ng-show，一切都应该工作正常。

来源

2017-03-02 12:50:10

在同一页面上的两个角度ui bootstrap分页不起作用

回答

相关问题