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

如何解决当我对 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

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