How to set angular pageIndex default as 1 in angular material?

Viewed 2061

My pageIndex in backend (legacy code) started with 1 and angular material paginator.pageIndex started with 0. How to set pageIndex default value as 1 in angular material? If I initialize pageIndex = 1. It's doesn't work actually. If I change backend value as 0 working but will break other legacy paginator. Is there any way to achieve this?

Im using angular 8 & angular material 8.02

app.ts

  @ViewChild(MatPaginator, {static: false}) paginator: MatPaginator;

  listOrders() {
    merge(this.paginator.page)
      .pipe(
        startWith({}),
        switchMap(() => {
          this.isLoadingResults = true;
          return this.storeService.orders(this.paginator.pageSize, this.paginator.pageIndex);
        }),
        map((data) => {
          this.isLoadingResults = false;
          this.resultsLength = data.max;
          return data.items;
        }),
        catchError(() => {
          this.isLoadingResults = false;
          return observableOf([]);
        }),
      )
      .subscribe((data) => (this.data = data));
  }

app.html

<mat-paginator
        [length]="resultsLength"
        [pageSize]="pageSize"></mat-paginator>

2 Answers

You can try this:

 ngOnInit() {
     this.dataSource.paginator = this.paginator;
  }

  ngAfterViewInit() {
    setTimeout(() => {
     this.paginator.pageIndex = 1;
    }, 0);
  }

Set pageIndex to 1:

<mat-paginator
    [ngClass]="'paginator'"
    [length]="this.propertyCount"
    [pageIndex]="1"
    [pageSize]="this.pageSize"
    [pageSizeOptions]="[5, 10, 25, 100]"
    (page)="updateTableResults($event)"
>
</mat-paginator>
Related