Question

我有以下实现（角度6）。

数据被精确提取并按预期显示在表中。但是分页器不起作用。

参见下文：

@ViewChild(MatPaginator) paginator: MatPaginator;

然后在构造函数中：

    this.dataSource = new MatTableDataSource([]);

    this.requestHttpService.getStuff()
        .subscribe(data => {
            this.results = data;
            this.dataSource = data;
        });

然后

ngAfterViewInit() {
    this.dataSource.paginator = this.paginator;
}

最后是HTML：

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

我不确定这段代码有什么问题，但是这些分页功能似乎都不起作用。我想念什么。

Answer 1

原来必须从

启动数据源负载

           ngAfterViewInit() {
           }

...并且根据建议here，必须将实际的分页器分配包装在SetTimeout（）函数中：

            setTimeout(() => {
                this.dataSource = new MatTableDataSource(this.results);
                this.dataSource.paginator = this.paginator;
            });

Angular HttpClient数据源分页器不起作用

1 个答案: