J'essaie d'aller à la première page du mat-paginator, c'est-à-dire de réinitialiser la pagination, mais cela ne fonctionne pas. Une idée de la façon dont cela peut être résolu?

Mon html est tel que

<mat-paginator [length]="itemTotal" [pageIndex]="page" [pageSize]="itemPage" (page)="pageEvent = getPublicationFollowersData($event)">
    </mat-paginator>

Le tapuscrit:

   getPublicationFollowersData(event?: PageEvent) {
      this.getPublicationsUser(event.pageIndex);
}

Et j'essaye d'initialiser la page avec:

this.page = 1

Mais ça ne marche pas.

6
MGs 27 janv. 2019 à 22:20

3 réponses

Meilleure réponse

Vous devez utiliser un décorateur ViewChild pour sélectionner le paginateur, puis définir la propriété pageIndex du paginateur.

@ViewChild() paginator: MatPaginator;
...
this.paginator.pageIndex = 0;

Modifier: comme suggéré par les autres réponses, si vous souhaitez réinitialiser le paginateur sur la première page, il serait préférable d'utiliser this.paginator.firstPage()

5
Stromwerk 10 déc. 2019 à 16:57
<mat-paginator #paginator [length]="length"
               [pageSize]="pageSize"
               [pageSizeOptions]="pageSizeOptions"
               (page)="pageEvent = paginationClicked($event)">
</mat-paginator>
@ViewChild('paginator') paginator: MatPaginator;
this.paginator.firstPage();
2
Shubham Verma 4 juil. 2019 à 10:21

Créer une référence pour la pagination angulaire du matériau avec la source de données

dataSource: MatTableDataSource<any>;
@ViewChild(MatPaginator) paginator: MatPaginator;

Vous souhaitez réinitialiser le paginateur à l'aide du code suivant

this.dataSource.paginator = this.paginator;

Vous pouvez également réinitialiser en appelant la méthode de la première page du paginateur

this.paginator.firstPage();
1
Rohan Shenoy 3 oct. 2019 à 09:45