同一页面上的两个 angular ui bootstrap 分页不起作用
Two angular ui bootstrap pagination on same page not working
我在同一个页面上有 2 angular 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>
在这里，我将 page_size 的值设置为 ng-init="page_size=50" 父 DIV 之一。
我的 table 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>
这里我将 page_size_main 的值设置为父 DIV 之一的 ng-init="page_size_main=50"。
我的 table tr 是：
<tr ng-repeat="em in main_details | limitTo: page_size_main:(current_page_main-1)*page_size_main"></tr>
奇怪的是，我的第一个 table 有 14 条记录，而且第一个分页工作正常。但是对于第二个 table，分页是根据数据长度正确创建的，但是 table 显示了所有记录。所以对于第二个，有 58 条记录，所以根据页面大小 50，正在创建 2 个页面，但是 table 显示所有 58 条记录并且分页 link 在第二个 table 中不起作用.
还有一件事，如果我将第一个 table 的页面大小设置为 10，然后将第二个 table 的数据过滤为 10，但第二个 table 的分页仍然不起作用].这很奇怪，我无法从任何地方获得解决方案。
有人可以帮帮我吗？
反对者给出原因，以便我改进我的问题。
我找到了问题的解决方案。这可能对某人有帮助，所以我发布了自己的答案。我用包含 ng-if 包装器的父 div 包装了我的第二个 table 分页。
<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-change 不会触发两次，因为在加载分页时我的模型项目页面有一个值，希望这对其他人有帮助。
因此，只需将 ng-if 替换为 ng-show 即可，一切正常。
我在同一个页面上有 2 angular 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>
在这里，我将 page_size 的值设置为 ng-init="page_size=50" 父 DIV 之一。
我的 table 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>
这里我将 page_size_main 的值设置为父 DIV 之一的 ng-init="page_size_main=50"。
我的 table tr 是：
<tr ng-repeat="em in main_details | limitTo: page_size_main:(current_page_main-1)*page_size_main"></tr>
奇怪的是，我的第一个 table 有 14 条记录，而且第一个分页工作正常。但是对于第二个 table，分页是根据数据长度正确创建的，但是 table 显示了所有记录。所以对于第二个，有 58 条记录，所以根据页面大小 50，正在创建 2 个页面，但是 table 显示所有 58 条记录并且分页 link 在第二个 table 中不起作用.
还有一件事，如果我将第一个 table 的页面大小设置为 10，然后将第二个 table 的数据过滤为 10，但第二个 table 的分页仍然不起作用].这很奇怪，我无法从任何地方获得解决方案。
有人可以帮帮我吗？
反对者给出原因，以便我改进我的问题。
我找到了问题的解决方案。这可能对某人有帮助，所以我发布了自己的答案。我用包含 ng-if 包装器的父 div 包装了我的第二个 table 分页。
<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-change 不会触发两次，因为在加载分页时我的模型项目页面有一个值，希望这对其他人有帮助。
因此，只需将 ng-if 替换为 ng-show 即可，一切正常。