2

我正在使用 nz-table 标签,我的表配置如下。

    <nz-table #stockTable
              [nzData]="listData" nzSize="small"
              [nzLoading]="loading"
              [nzTotal]="pageTotal"
              [nzPageIndex]="pageIndex"
              [nzPageSize]="pageSize"
              [nzShowPagination]="true">

而不是使用表格分页而是使用单独的分页组件,如下所示

    <nz-pagination (nzPageIndexChange)="pageIndexChanged($event)" (nzPageSizeChange)="pageSizeChanged($event)"
                   [nzPageIndex]="pageIndex" [nzPageSizeOptions]="pageSizeOptions"
                   [nzPageSize]="pageSize" [nzTotal]="pageTotal" [nzShowTotal]="totalTemplate"
                   class="pagination" nzShowQuickJumper
                   nzShowSizeChanger>
      <ng-template #totalTemplate let-total> Toplam {{ total }} stok bulunmaktadır.</ng-template>
    </nz-pagination>

更新到版本 9 ng-zorro 后。当按 nz-pagination 显示数据来自 API 但页面不刷新的第二页时,nz-pagination 在版本 8 上开始不像以前那样工作。所有数据都属于第 1 页

我还添加了 pageIndexchange 和加载数据方法。页面索引页面大小filterModel

  pageIndexChanged($event: number) {
    this.pageIndex = $event;
    this.filterModel.pageIndex = this.pageIndex;
    this.loadPage();
  }

  loadPage() {
    this.filterModel.searchTerm = this.searchTerm;
    this.stockHttpService.getList(this.filterModel).subscribe(data => {
        if (this.stockHttpService.checkResponse(data)) {
          this.loading = false;
          this.pageTotal = data.apiResult.dataCount;
          this.listData = data.apiResult.dataResult;
        }
      }
    );
    this.savePageParameter();
  }
4

0 回答 0