Пагинация на динамические c данные - PullRequest
Новая
       23

Пагинация на динамические c данные

0 голосов
/ 18 июня 2020

У меня есть вызов службы, где я получаю данные из HTTP-запроса, теперь данные идут со счетчиком и ответом, каждый раз, когда ответ имеет счетчик 10, но на самом деле данные больше 10, например 50, что требует разбивки на страницы , означает, что серверная часть отправляет данные с разбивкой на страницы. Я использую mat-paginator в mat-table, чтобы показать разбиение на страницы, он показывает данные с 10 списками, но для остальных разбивка на страницы не работает 

 <mat-paginator
      hidePageSize
      [length]="count"
      [pageSize]="pageSize"
      (page)="onPaginationChange($event)"
    >
    </mat-paginator>

любая идея о том, как для этого? 

data: {
count: 44
result: [,…]
}

вот что я получаю 

   public count: number;
   public memberList: ITeamMember[];
   public pageSize: number;

public dataSource: MatTableDataSource<IMemberList> = new MatTableDataSource<
    IMemberList
  >();
  private sort: MatSort;
  private paginator: MatPaginator;

  @ViewChild(MatSort) set matSort(ms: MatSort) {
    this.sort = ms;
    this.setDataSourceAttributes();
  }
  @ViewChild(MatPaginator) set matPaginator(mp: MatPaginator) {
    this.paginator = mp;
    this.setDataSourceAttributes();
  }

ngOnInit(): void {
    this.isDataLoading = true;
    this.createTeamMemberList();
  }

  private setDataSourceAttributes(): void {
    this.dataSource.paginator = this.paginator;
    this.dataSource.sort = this.sort;
  }

  ngAfterViewInit(): void {
    this.cd.detectChanges();
  }

public createTeamMemberList(): void {
    this.teamService.getTeamMembers().subscribe(
      (response: TeamMemberResponse) => {
        this.dataSource = new MatTableDataSource<IMemberList>(
          this.individualMember
        );
        this.dataSource.paginator = this.paginator;
        this.pageSize = response.result.length;
        this.count = response.count;
      },
      (error: Error) => {
        this.isDataLoading = true;
        this.sharedService.openErrorSnackBar(error);
      }
    );
  }

a

...