Question

我正在使用来自primefaces的数据表 - primeNg。我可以获取当前页面并以编程方式将数据表设置为特定页面吗？

我看到datatable使用了分页组件，但是如何使用@ViewChild访问它？任何帮助将不胜感激。

Answer 1

<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，因此您可能需要使用解决方法直到缺陷关闭。根据primeng文档要以编程方式将数据表设置为特定页面，请先设置“＆＃39;使用您想要查看的行号。例如

this.first = 10 //will show second page, OR
this.first=20  //will show third page.

获取当前页面并移至NgPrime数据表中的特定页面

1 个答案: