当存在两个表时，角度材料分页可能不起作用答案

【问题标题】：Angular material pagination isn't working probably when two tables exist当存在两个表时，角度材料分页可能不起作用
【发布时间】：2019-10-17 23:09:56
【问题描述】：

如果有两个表，我会遇到材料分页问题：问题似乎是这样的：Multiple material pagination in one component doesn't work in Angular

我尝试在上面的链接中实现解决方案，但在控制台中它给了我：

this.paginator.toArray 不是函数

这是我的实现：

  customerTblArray: MatTableDataSource<any>;
  UnitModelsTblArray: MatTableDataSource<any>;
@ViewChild(MatPaginator) paginator = new QueryList<MatPaginator>();



 constructor(private _getCustSrv: GetCustomersService,  private _getUnitModels: GetUnitModelsService) {
    this._getCustSrv.GetAllCustomers().subscribe(r => {
      this.customerTblArray = new MatTableDataSource(r["result"]);
    });

    this._getUnitModels.GetAllUnitModels().subscribe(r => {
      this.UnitModelsTblArray = new MatTableDataSource(r["result"]);
    });
  }

  ngAfterViewInit(): void {
    this.customerTblArray.paginator = this.paginator.toArray()[0];
    this.UnitModelsTblArray.paginator = this.paginator.toArray()[1];
  }

.HTML 代码非常大，我使用引导模式显示内容，在每个模式的末尾我放：

<mat-paginator [pageSize]="3">
</mat-paginator>

但在控制台显示错误：

this.paginator.toArray 不是函数

即使所有内容都正确加载了材料表，但分页我无法正常工作。

【问题讨论】：

标签： angular

【解决方案1】：

代替：@ViewChild(MatPaginator) paginator = new QueryList<MatPaginator>();

输入：@ViewChildren(MatPaginator) paginator = new QueryList<MatPaginator>();

这就够了。

【讨论】：