我正在使用 primefaces - primeNg 的数据表。我可以获取当前所在页面并以编程方式将数据表设置为特定页面吗?
我看到数据表使用了分页组件,但是如何使用@ViewChild访问它?
任何帮助将不胜感激。
<p-dataTable #dt [value]="items" [rows]="10" [paginator]="true" [(first)]="first" (onPage)="paginate($event)">
解决方法 - 以编程方式将数据表设置到特定页面。
@ViewChild('dt') dataTable: DataTable;
setCurrentPage(n: number) {
let paging = {
first: ((n - 1) * this.dataTable.rows),
rows: this.dataTable.rows
};
this.dataTable.paginate(paging);
}
// this.setCurrentpage(pageNumber) will set table to given page number
要获取您所在的当前页面,请使用 (onPage) 事件,如下所示
paginate(event) {
//event.first: Index of first record being displayed
//event.rows: Number of rows to display in new page
//event.page: Index of the new page
//event.pageCount: Total number of pages
let pageIndex = event.first/event.rows + 1 // Index of the new page if event.page not defined.
}
似乎有一个defect https://github.com/primefaces/primeng/issues/3198针对以下设置页码的方式提出,因此您可能需要使用变通方法,直到缺陷被关闭。
根据 primeng 文档
要以编程方式将数据表设置到特定页面,请使用您想要查看的行号设置“first”。
例如
this.first = 10 //will show second page, OR
this.first=20 //will show third page.
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)