我在我的角度项目中使用primeNG数据表。在我的一个场景中,我需要获取primeNG数据表的当前页码并将该号码传递到下一个屏幕,当用户导航回上一个屏幕时,我想再次设置该页码。
我检查了primeNG数据表,但没有明确的方法来获取和设置当前页码。
那么你不能直接得到页码,但你可以得到第一个显示行的偏移量(基于零),然后知道每页显示的项目数量计算页码。
来自文档: “... Paginator也可以通过模型控制,使用绑定到第一个属性,其中更改触发分页.Optionaly这个属性支持双向绑定,因此模型值也可以在分页上更新。这是一个重置示例外部的分页器。“,
“......首先 - 要显示的第一行的零相对数。”,(https://www.primefaces.org/primeng/#/datatable,https://www.primefaces.org/primeng/#/paginator)
模板:
<p-dataTable [value]="cars" [rows]="10" [paginator]="true" [(first)]="first">
<p-column field="vin" header="Vin"></p-column>
<p-column field="year" header="Year"></p-column>
<p-column field="brand" header="Brand"></p-column>
<p-column field="color" header="Color"></p-column>
</p-dataTable>
<button type="button" (click)="reset()" label="Reset"></button>
码:
export class DataTableDemo implements OnInit {
cars: Car[];
first: number = 0;
constructor(private carService: CarService) { }
ngOnInit() {
this.carService.getCarsSmall().then(cars => this.cars = cars);
}
reset() {
this.first = 0;
}
}
正如文档所述,通过将[(first)]
绑定到组件中的变量,您还可以在分页状态更改时更新变量,因此您可以像这样pageNumber = offset/itemsPerPage
计算页码
使用<p-paginator>
这个标签有一个名为onPageChange()的函数。您可以在此功能中获取页码