PrimeNG 设置页面为第一个使用延迟加载表

Faq*_*tt0 1 lazy-loading primeng primeng-datatable

我正在使用p-table带有“分页器”和“延迟加载”的组件,并且我根据需要制作了一个搜索组件。
当我进行过滤并且页面索引位于另一个页面上时,我正在尝试解决该问题。
示例:
页面索引 = 2
过滤文本 = texto。

然后,我更新表上的记录和页数。但如果结果有更多或相等数量的索引页,则页索引继续为 2。

我尝试从 Event 更改值,但它不适用。

文档 PrimeNG 延迟加载:

loadData(event: LazyLoadEvent) {
  //event.first = First row offset
  //event.rows = Number of rows per page
  //event.sortField = Field name to sort in single sort mode
  //event.sortOrder = Sort order as number, 1 for asc and -1 for dec in single sort mode
  //multiSortMeta: An array of SortMeta objects used in multiple columns sorting. Each SortMeta has field and order properties.
  //filters: Filters object having field as key and filter value, filter matchMode as value
  //globalFilter: Value of the global filter if available
  this.cars = //do a request to a remote datasource using a service and return the cars that match the lazy load criteria
}
Run Code Online (Sandbox Code Playgroud)

Dir*_*ind 5

我假设您已经创建了搜索组件,您将在其中进行搜索并将反映在 turbo 表中。您没有使用 Turbotable 的全局过滤器。在这种情况下,您必须先重置表,然后再获取记录。

假设下面是你的表:

<p-table #tt [value]="testdata" class="test-data" [lazy]="true"
         (onLazyLoad)="loadDataLazily($event)"
            [paginator]="true" [rows]="3" [totalRecords]="totalRecords">
Run Code Online (Sandbox Code Playgroud)

在您的component.ts文件中为您的表格使用选择器,例如#tt Now

在您的过滤方法中重置您的表格;

import { Table } from '../../../../node_modules/primeng/components/table/table';
    export class TableComponent{
     @ViewChild('tt') tt: Table;
     filter(){
      this.tt.reset();
     }
}
Run Code Online (Sandbox Code Playgroud)