Нумерация страниц в Angular материале не работает должным образом - PullRequest
1 голос
/ 08 января 2020

В моем виде сетки разбивка на страницы не работает должным образом. Я прилагаю свой вид ниже.

enter image description here

Я объясняю мой код ниже.

comp onet file:

<table mat-table [dataSource]="dataSource" matSort (matSortChange)="sortChange($event)">

<mat-paginator [pageSizeOptions]="[1,10, 25, 50, 100]" [pageSize]="pageSize" [pageIndex]="pageIndex" [length]="totalCount" (page)="pageChange($event)" showFirstLastButtons></mat-paginator>
</table>
.ts file:
@ViewChild(MatPaginator,{static: false}) 
paginator: MatPaginator;
@ViewChild(MatSort,{static: false}) 
sort: MatSort;
dataSource = new  MatTableDataSource<Stores>([]);
pageSize    = 1;
pageIndex   = 1;
totalCount        : number;
ngOnInit() {

    this.dataSource.paginator = this.paginator;

    this.getStores(1, 10);
  }
getStores(page, limit) {
    let sortBy  = this.direction ? this.direction == 'asc' ? this.sortName : '-' + this.sortName : 'updatedAt';
    let filters = {
      "page"        : page,
      "limit"       : limit,
      "sortby"      : sortBy,
      "searchvalue" : this.searchValue || ''
    }
    this.api.getStores(filters).subscribe(x => {
      console.log('xx',x);
      this.data                 = x['data'];
      this.storeData         = this.data;
      this.dataSource.data      = this.storeData;
      this.dataSource.sort      = this.sort;
      // this.paginator.pageIndex  = this.pageIndex - 1;
      this.allchecked           = false;


    });
  }

pageChange(event) {
    this.pageIndex = this.paginator.pageIndex + 1;
    this.getStores(this.paginator.pageIndex + 1, this.paginator.pageSize);
  }

Здесь у меня всего 2 записи, которые я извлекаю из базы данных, и на страницу, которую я выбрал 1, но здесь отображаются все записи и нумерация страниц не идет. Мое требование заключается в том, что если номер страницы меньше, чем общее извлечение записи, то нумерация страниц должна работать, как и ожидалось.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...