【问题标题】:Customise mat-paginator to show total number of records自定义 mat-paginator 以显示记录总数
【发布时间】:2020-06-06 07:09:05
【问题描述】:

我正在使用 Angular Material Design UI 框架提供的 mat-paginator。

我目前有如下所示的设置,但除了这些信息之外,我还希望能够在下面显示的分页器块中显示记录总数(即 45 条)。

我从后端服务得到的响应如下;

page: {size: 5, totalElements: 45, totalPages: 9, number: 0}

我已使用此信息来设置 mat-paginator 属性,如下所示。

  <mat-paginator #paginator
    [length]=result.pages
    [pageSize]=result.pageSize
    [pageSizeOptions]="[5, 10, 20, 50, 100]"
    [pageIndex]=result.page
    (page)="getNext($event)"
    showFirstLastButtons>
  </mat-paginator>

【问题讨论】:

    标签: angular-material


    【解决方案1】:

    鉴于后端服务的以下响应...

    page: {size: 5, totalElements: 45, totalPages: 9, number: 0}
    

    以下定义就足够了:

    <mat-paginator #paginator
        [length]="result.page.totalElements"
        [pageSizeOptions]="[5, 10, 20, 50, 100]"
        (page)="getNext($event)"
        showFirstLastButtons="true">
    </mat-paginator>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2022-06-16
      • 1970-01-01
      • 1970-01-01
      • 2020-07-27
      • 2018-06-02
      • 2019-07-08
      相关资源
      最近更新 更多