【问题标题】:Material design paginator doesn't work with tables dynamically generated材料设计分页器不适用于动态生成的表格
【发布时间】:2020-02-11 02:52:36
【问题描述】:

我正在尝试使用材料表生成具有多列的多个表,并且它工作正常。 但是当对每个表的结果进行分页时就会出现问题。 好像没有取每张表的引用,那么所有的分页符都设置为0。

这是我在 stackblitz 中的代码:

https://stackblitz.com/edit/angular-k8qfd3?file=src%2Fapp%2Fapp.component.ts

【问题讨论】:

  • 你能给我看看代码吗?
  • 也许这就是 stackblitz 的工作方式,但我的问题是,为什么所有代码​​都是预编译的,而不是原始 typescript 格式?
  • 请检查您是否提供了 mat-paginator [length]="100" 表数据长度
  • 检查 app.component.ts 中的第 118 行。 this.paginator 总是未定义的。

标签: angular angular-material angular-material-paginator


【解决方案1】:

尝试在 ngAfterViewInit 钩子中设置分页长度。

ngAfterViewInit() {

this.paginationLength = this.tableData.length;

}

在模板中:

<mat-paginator [length]="paginationLength"
              [pageSize]="10"
              [pageSizeOptions]="[5, 10, 25, 100]">
</mat-paginator>

【讨论】:

  • 它不起作用,因为 tableData 是在 for 循环内的 run() 方法内动态生成的。见第 119 行
猜你喜欢
  • 2015-11-16
  • 1970-01-01
  • 1970-01-01
  • 2015-05-19
  • 1970-01-01
  • 1970-01-01
  • 2021-09-03
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多