在同一頁面上的兩個角度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分頁不起作用

回答

相關問題