带分页的 ng zorro 表

Question

我的 zorr 表有分页问题。使用单独的组件进行分页，如下所示

<nz-table #dynamicTable
                [nzScroll]="fixHeader ? { y: '240px' } : null"
                [nzData]="countryList"
                [nzLoading]="loading"
                [nzShowPagination]="false"
                [nzFooter]="footer ? 'Sayfalama' : null"
                [nzTitle]="title ? 'Müşteri Listesi' : null"
                [nzSize]="size">
        <thead>
        <tr *ngIf="header">
<!--          <th nzWidth="50px"></th>-->
          <th nzWidth="150px">Kod</th>
          <th nzWidth="70px">Ad</th>
          <th>3'lü kod</th>
          <th nzWidth="260px">Telefon kodu</th>
        </tr>
        </thead>
        <tbody>
        <tr *ngFor="let data of dynamicTable.data">
<!--          <td nzShowCheckbox *ngIf="checkbox" [(nzChecked)]="data.checked"></td>-->
          <td>{{ data.code }}</td>
          <td>{{ data.name }}</td>
          <td>{{ data.tripleCode }}</td>
          <td>{{ data.phoneCode }}</td>
        </tr>
        </tbody>
      </nz-table>
      <br>
      <nz-pagination class="pagination" nzShowSizeChanger nzShowQuickJumper [nzTotal]="total" [(nzPageIndex)]="pageIndex" [(nzPageSize)]="pageSize"
                     (nzPageSizeChange)="pageSizeChanged($event)" (nzPageIndexChange)="pageIndexChanged($event)"
                     [nzPageSizeOptions]="pageSizeOptions">
      </nz-pagination>

问题是当我设置数据的总记录时，它也是从 API 获取的，如下所示。表格只显示 10 条记录，无论总数是多少。

loadPage() {
    this.apiService.postAny(['ListAsync'], null, this.filterModel).subscribe(data => {
      if (this.apiService.checkResponse(data)) {
        this.loading = false;
        this.total = data.result.count;
        this.countryList = [];
        this.countryList = data.result.result as CountryListModel[];
      }
    }, error => {
      console.log(error);
    }, () => {
      console.log('Country load completed !');
    });
  }

API 返回 17 条记录，但表仅显示 10 条记录。如果我使用带有页码的页面导航，我可以看到所有带有页面大小的记录。但是，如果我直接更改页面大小（例如将其设置为每页 20 个）表只显示 10 条记录而已。但 API 按预期返回。

Answer 1

您需要为计数页添加 [nzTotal] 和 [pageIndex]、[pageSize]