NGX数据表 - 使用函数

时间:2017-04-13 19:10:39

标签: angular offset ngx-datatable

我使用输入过滤我的表,并希望每当过滤器更新时将表重置为第一页。现在表格显示和过滤工作但表格页面没有重置。

以下是我的目标:

表:

 <ngx-datatable
  class='material'
  [rows]='rows'
  [columns]="columns"
  [columnMode]="'standard'"
  [headerHeight]="75"
  [footerHeight]="50"
  [scrollbarH]="true"
  [rowHeight]="'auto'"
  [limit]="5"
  [selectionType]="'multiClick'"
  [offset]="tableOffset"
  >
</ngx-datatable>

相关TS:

tableOffset = 0;

updateFilter(event, seachCriteria) {

  // Filtering Process...

  // Whenever the filter changes I want to go back to the first page
  this.tableOffset = 0;
}

指出我出错的地方?

修改 所以我尝试将偏移量设置为1,发现用this.tableOffset = 0重置;确实有效,但每当我使用箭头导航到不同的页面时,它都会阻止重置。

这是一个错误还是我错过了什么?

2 个答案:

答案 0 :(得分:1)

您还必须处理页面事件。

查看

<ngx-datatable
    ...
    [offset]="tableOffset"
    (page)="onChange($event)">
</ngx-datatable>

<强>组件

updateFilter(event, seachCriteria) {
    ...
    this.tableOffset = 0;
}

onChange(event: any): void {
    this.tableOffset = event.offset;
}

答案 1 :(得分:0)

<ngx-datatable
    #table
    class="material"
    [columns]="columns"
    [columnMode]="'force'"
    [headerHeight]="50"
    [footerHeight]="50"
    [rowHeight]="'auto'"
    [limit]="10"
    [rows]="rows"
  >
  </ngx-datatable>

ts文件

import { DatatableComponent } from '@swimlane/ngx-datatable';; @ViewChild(DatatableComponent, { static: false }) table: DatatableComponent;

updateFilter() {
// update the rows
this.rows = [...this.rows];
// Whenever the filter changes, always go back to the first page
this.table.offset = 0; }