如何将mat-paginator中的pageIndex传递给Angular 9中的API

Question

.html文件

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

.ts文件

listCustomer() {
   
    this.customerservice
      .getCustomer(this.pageSize, this.paginator.pageIndex + 1)
      .subscribe((res) => {
        this.list = res["success"].data;
        this.dataSource = new MatTableDataSource(this.list);
        this.dataSource.sort = this.sort;
        this.dataSource.paginator = this.paginator;
       
    });
}

我的错误是：

core.js:4061 ERROR TypeError: Cannot read property 'pageIndex' of undefined

如何解决此问题？

这是stackblatz

上的示例

Answer 1

 .getCustomer(this.pageSize, this.paginator.pageIndex + 1)

似乎是这样。paginator为空

u必须使用viewChild来获取对分页器的引用

// component
    @ViewChild('paginatorComp') paginator: MatPaginator;

// html
<mat-paginator #paginatorComp [pageSize]="10" [pageSizeOptions]="[5, 10, 25]"> </mat-paginator>

Answer 2

如果使用viewChild，则可能需要实现AfterViewInit循环钩子，并在该钩子中使用分页器。因为进入OnInit，您仍无法访问此数据。