Как сделать условное утверждение для mat-paginator? - PullRequest
Новая
       1

Как сделать условное утверждение для mat-paginator?

0 голосов
/ 07 ноября 2019

Я пытаюсь mat-paginator, и он работает. Но, когда я держу его в * ngIf, он не работает. 

<mat-paginator  (page)="changePage($event)"
           [length]="100"
           [pageSize]="20">
</mat-paginator>

Над одним Работает. 

<div *ngIf="!spinner">
    <mat-paginator  (page)="changePage($event)"
           [length]="100"
           [pageSize]="20">
    </mat-paginator>
</div>

Когда я использую * ngIf, страница не перемещается. Появляется пагинатор. Однако мы не можем перейти к следующей странице с условным утверждением. Почему это происходит?

Я хочу получить условное утверждение для paginator и должен отображаться paginator. Есть ли другой способ использовать условное выражение для paginator?

1 Ответ

1 голос
/ 08 ноября 2019

По вашему требованию, указанному в комментарии:

Существует возможность явно указывать индекс выбранной страницы в mat-paginator. Это можно сделать с помощью pageIndex input.

Все, что вам нужно сделать, это как только страница изменится, сохранить индекс страницы в переменной и передать индекс в качестве ввода в mat-paginator.

В html внесите следующие изменения: 

<div *ngIf='!spinner'>
  <mat-paginator [length]="100" [pageSize]="10" (page)="changePage($event)" [pageIndex]='pageIndex'>
  </mat-paginator>
</div>

в ваш файл ts: 

  changePage(event : PageEvent){
    console.log("i'm called");
    this.pageIndex = event.pageIndex;
  }

Я изменил пример, которым я поделился в комментарии, который используетвыше логика здесь

...