PrimeNG 分页器设置页面答案

【问题标题】：PrimeNG Paginator set PagePrimeNG 分页器设置页面
【发布时间】：2021-02-16 15:05:16
【问题描述】：

我在 Angular 9 项目中使用 primeng 分页器组件来分页大量配置文件。如果用户在第 3 页，打开个人资料并返回搜索，则当前页面为 1，但应该为 3。我已将页面保存在服务中，因此显示了正确的数据，但分页器显示错误的页面。我找不到设置分页器当前页面的方法。使用 [first] 属性不起作用。

【问题讨论】：

标签： angular primeng

【解决方案1】：

您需要手动设置页面。您可以使用 Angular @ViewChild 装饰器来访问 PrimeNg Paginator 组件。

给模板中的分页器一个 id：

<p-paginator #paginator ...></p-paginator>

并在组件中使用：

import { Paginator } from 'primeng/paginator';


@ViewChild('paginator', { static: true }) paginator: Paginator

private updateCurrentPage(currentPage: number): void {
  setTimeout(() => this.paginator.changePage(currentPage));
}

【讨论】：

谢谢，这行得通。我只需要设置 setTimeout(() => { this._paginator.changePage(this.musicianService.page) }, 0);让它工作。
我最终使用了this.paginator.changePageToFirst(null);，以便在更新过滤器时重置页面索引（注意：这确实在源代码中调用了changePage(0)）。