角度材料分页和排序问题

Nik*_*lin 3 angular-material angular

我一直在寻找这个问题的解决方案,但不幸的是无法使其发挥作用。我遵循官方的角度材料指南并编写了以下代码,该代码应该支持材料表的分页和排序:

export class RecentAnnouncementsComponent implements OnInit, AfterViewInit {

  displayedColumns: string[] = ['created_utc', 'name', 'title'];
  dataSource = new MatTableDataSource<any>();
  items: ItemData[] = [];

  constructor(private firebaseService: FirebaseService) { }

  @ViewChild(MatPaginator) paginator: MatPaginator;
  @ViewChild(MatSort) sort: MatSort;

  ngOnInit(): void {
    
  }

  ngAfterViewInit() {
    this.firebaseService.getItems().subscribe(result => {
      this.items = result;
      this.dataSource.data = this.items;
      this.dataSource.sort = this.sort;
      this.dataSource.paginator = this.paginator;
    });
  }
}
Run Code Online (Sandbox Code Playgroud)

仍然存在以下错误:

属性“paginator”没有初始值设定项,并且未在构造函数中明确分配。

我尝试根据这些答案修改代码,但没有任何效果。我最多消除了错误,但分页和排序按钮不会影响表格项目。

我将非常感谢解决这个问题的建议。

小智 5

我假设您正在开发最新版本的 Angular。我这样做了,并且我得到了这个工作:

  @ViewChild(MatSort) sort: MatSort = new MatSort();
  @ViewChild(MatPaginator) paginator: MatPaginator = new MatPaginator(new MatPaginatorIntl(), ChangeDetectorRef.prototype);
Run Code Online (Sandbox Code Playgroud)