Question

我需要将p-table的选定页面作为最后一页。

我可以获取表对象：

@ViewChild('myTable') myTable: DataTable;

ngOnInit() {

    this.subService.subsUpdated.subscribe(result => {
      this.fetchSubcontracts();
    });

    this.appForm.subAdded.subscribe(result => {
      this.added = 4;
      this.fetchSubs();
    });

  }

我尝试将[first]上的[paginatorPosition]和p-table属性绑定到一个属性，但这没用。

<p-table #myTable
           [value]="subs"
           sortMode="multiple"
           selectionMode="single"
           (onRowSelect)="onRowSelect($event)"
           (onRowUnselect)="onRowUnselect($event)"
           [(selection)]="selectedSub"
           [columns]="columns"
           dataKey="id"
           [paginator]="subs.length > 0"
           [rows]="5"
           [first]="added"
           >

Answer 1

尝试使用onPageChange()函数：

this.appForm.subAdded.subscribe(result => {
  // number of pages in the table
  const pageCount = Math.ceil(this.myTable.totalRecords / this.myTable.rows);
  // last page
  const page = pageCount - 1;
  this.myTable.onPageChange({
    pageCount,
    page,
    first: page * this.myTable.rows,
    rows: this.myTable.rows
  });
  this.fetchSubs();
});

代替

this.myTable.totalRecords

您也可以使用

this.subs.length

您还可以从HTML删除[first]="added"

Answer 2

first属性是要显示的第一个行的索引，而不是要显示的第一页的索引。

在表格属性中，每页设置了5行，因此如果添加的等于4，则您将始终停留在包含第四行的第一页上。

因此添加应该类似于Math.floor(this.subs.length/5)

Answer 3

这对我有用：

@ViewChild('dt', { static: false }) table: Table;

this.table.first = Math.floor(this.table.totalRecords / this.table.rows) * this.table.rows;
this.table.firstChange.emit(this.table.first);
this.table.onLazyLoad.emit(this.table.createLazyLoadMetadata());

将页面选择设置为PrimeNG p表的最后一页

3 个答案: