更新版本9

时间:2020-04-28 13:58:45

标签: angular antd ant-design-pro ng-zorro-antd

我正在使用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在版本8上开始无法像以前一样工作 当按第二页时,nz-pagination显示数据来自API,但页面未刷新。所有数据都属于第1页

我还添加了pageIndexchange和load数据方法。 页面索引页面大小 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();
  }

0 个答案:

没有答案