Добавить функциональность «Перейти к странице» для разбивки на страницы в угловых

Question

Мне нужно добавить функцию «перейти к» в разбивке по материалам. у него нет встроенного метода для этого, поэтому мне нужно добавить его вручную.

на данный момент у меня есть этот код:

<mat-paginator [length]="pageLength"
                       [pageSize]="10"
                       [pageSizeOptions]="pageLength | checkPageLength"
                       [showFirstLastButtons]="true">
        </mat-paginator>

и это показывает: моя текущая нумерация страниц и мне нужно иметь текстовое поле и кнопку «Перейти» для перехода на определенную страницу, так как у меня много страниц.

Answer 1

Я нашел фрагмент кода из здесь , который отлично работает для меня:

this.paginator.pageIndex = pageNumber;

this.paginator.page.next({      
     pageIndex: pageNumber,
     pageSize: this.paginator.pageSize,
     length: this.paginator.length
});

Working_Example

Answer 2

В вашем html-файле

<mat-form-field>
   <input matInput [(ngModel)]="goToPage">
</mat-form-field>
<button (click)="updateGoToPage()">Go</button>

И в вашем ts-файле

@ViewChild(MatPaginator) paginator: MatPaginator;

goToPage = null;
updateGoToPage() {

    this.paginator.pageIndex = this.goToPage - 1;
  }

Может быть, это поможет.