当我对 100-200 条记录的 Angular Material 数据表的分页器值进行排序或更改时,页面会冻结

问题描述

我有一个包含大约 200 条记录的角度材料数据表。我在数据表上使用了 mat-paginator 和 mat-sort 。 当我单击排序图标或将分页器编号从 25 更改为 50 或 100 时,它会冻结 4-5 秒。这么少的记录应该不会发生吧?

代码如下:

@ViewChild(MatSort,{ static: true }) sort: MatSort;
@ViewChild(MatPaginator,{ static: true }) paginator: MatPaginator;

changeDetection: ChangeDetectionStrategy.OnPush,ngOnInit(): void {
  this._sleeve.getPublishedSleeves().subscribe((sleeves: Sleeve[]) => {
    this.dataSource = new MatTableDataSource(sleeves);
    this.dataSource.paginator = this.paginator;
    this.dataSource.sort = this.sort;
    this.dataSource.filterPredicate = this.createFilter();
    this.dataSource.filter = JSON.stringify(this.filterValues); // applying filters if any
  });
}

当我把上面的逻辑放在 ngAfterViewInit 而不是 ngOnInit

时,它的工作原理是一样的

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)