Question

我正在尝试mat-paginator，它正在工作。但是，当我将其保存在* ng中时，如果它无法正常工作。

<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>

当我使用* ng时，如果页面没有移动。分页器出现。但是，我们无法转到具有条件语句的下一页。为什么会这样？

我想让分页器有条件声明，应显示分页器。还有其他方法可以对分页器使用条件语句吗？

Answer 1

根据注释中指定的要求：

有一个选项可以在mat-paginator中显式设置页面选择的索引。可以使用pageIndex输入来完成。

您要做的就是页面更改后，立即将页面Index保存在变量中，并将索引作为输入传递到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;
  }

我修改了我在使用上述逻辑here

的注释中共享的示例

如何为mat-paginator提供条件语句？

1 个答案: