Paginate Pipe如何成功訪問Angular 2 App中的數組長度？

我有一些有趣的情況，我有一些代碼在Angular 2應用程序中工作 - 它產生了正確的值 - 但我不確定它是如何完成的。Paginate Pipe如何成功訪問Angular 2 App中的數組長度？

具體來說，我使用ng2-pagination在我的應用程序中處理分頁。我使用它的方式是，輸入每頁所需結果的數量，並通過計算結果數組的長度來計算分頁的正確頁數。

在我的情況下，正在生成正確的頁數 - 這告訴我，ng2分頁成功地做了這個數學。但我不完全確定它現在正在獲取數組的長度。

下面是我在組件中的相關代碼。基本上它調用一個服務並運行兩個在OnInit循環中觸發的函數。第一個獲取所有記錄。而第二個獲得這些記錄的總數：

ngOnInit() { 
    this.customerService.getAll() 
     .subscribe(resRecordsData => this.records = resRecordsData, 
     responseRecordsError => this.errorMsg = responseRecordsError); 

    this.customerService.getCustomerCount() 
     .subscribe(resRecordsData => this.customerCount = resRecordsData, 
     responseRecordsError => this.errorMsg = responseRecordsError); 
}

然後，在我看來，我遍歷這些項目，並通過他們通過PAGINATE管，就像這樣：

<tr *ngFor="let record of records | paginate: { id: 'customers', itemsPerPage: 15, currentPage: page }">

我我還設置了一些針對PAGINATE管的參數與該代碼的觀點：

<div *ngIf="!!records && records.length" class="pagination"> 
        <pagination-controls class="paginator" (pageChange)="page = $event" id="customers" 
          maxSize="15" 
          directionLinks="true" 
          autoHide="true"> 
        </pagination-controls> 
      </div>

現在目前我有不到900個記錄這個收藏。通過上面的代碼，正在視圖中生成正確的頁數。換句話說，因爲集合包含了不到900個項目，而且我將每個頁面的顯示設置爲15個，所以它正好生成了60個頁面 - 這是正確的！

問題是，管道如何獲得信息：900項，因爲我似乎沒有在任何地方傳遞？

來源

2017-03-15 Muirik

它正在處理管道中的collection.length，就是它。 – Fals

因爲「讓記錄的記錄」，你的意思是？ – Muirik

它詢問記錄數組的長度並使用它。

Check the source code for the pagination pipe.

來源

2017-03-15 19:27:49 snorkpete

所以你說它在* ngFor的「記錄記錄」部分中，分頁管道正在訪問數組的長度？那麼它不需要作爲參數傳入呢？那是對的嗎？ – Muirik

它被傳遞 - 作爲分頁管道的參數。 – snorkpete

它正在通過「讓記錄記錄」，正確嗎？ – Muirik

Paginate Pipe如何成功訪問Angular 2 App中的數組長度？

回答

相關問題