ngx-datatable double initial call on paging

Question

this is my implementation using ngx-datatable

html

<ngx-datatable
  class="table-base table-base_border clickable-list"
  [rows]="tickets"
  [headerHeight]="30"
  [footerHeight]="50"
  [columns]="columns"
  [columnMode]="'flex'"
  [externalPaging]="true"
  [count]="page.totalElements"
  [offset]="page.pageNumber"
  [limit]="page.size"
  [rowHeight]="40"
  (page)="onPageChange($event)"
  [externalSorting]="true"
  [selectionType]="'single'"
  [messages]="messages | async"
  (select)="onSelect($event)"
  [scrollbarV]="true"
  [scrollbarH]="false"
  [virtualization]="false"
  ></ngx-datatable>

.ts

ngOnInit(): void {
  this.onPageChange({ offset: 0 });
}

onPageChange(pageInfo: any): void {
  this.page.pageNumber = pageInfo.offset;
  this.gridQuery.page.size = this.page.size;
  this.gridQuery.page.pageNumber = pageInfo.offset + 1;

  this.getData();
}

The problem is getData() twice, like datatable always call onPageChange() after the component is loaded.

How can I prevent double calling of getData()?

Check if data is initialized or use a simple flag? – zerocewl Sep 19 '19 at 11:45 — zerocewl, Sep 19 '19 at 11:45

score 2 · Answer 1 · answered Sep 25 '19 at 20:04

2

The problem is getData() twice, like datatable always call onPageChange() after the component is loaded.

You should not need to call onPageChange in ngOnInit. As you are seeing, the datatable will already call it.

answered Sep 25 '19 at 20:04

user981225

8,762
6
32
41

ngx-datatable double initial call on paging

1 Answers1