Ngx-datatable: Ngx- DataTable data refresh Issue

[ThakkarKhushbu]

I'm submitting a ... (check one with "x")

[ ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, post on Stackoverflow or Gitter

Current behavior
I have used Ngx -data table in my angular 4 Project . when I added new row to grid , data not getting refresh data.

I have Push data in row after adding row , but it is not refreshing data .I have used below code to push row in rows.

        let tempRows = this.rows;
        tempRows.push(result);
        this.rows = tempRows;

does ngx-data table provide refresh method? .If not can you suggest any alternatives?
Expected behavior

Reproduction of the problem

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Table version: 0.8.x
  

• Angular version: 2.0.x
  : 1.2.7
  node: 6.10.2
  os: win32 x64
  : 4.3.4
  : 2.0.0-beta.8
  : 4.3.4
  : 4.3.4
  : 4.3.4
  : #4.3.4
  : 4.3.4
  : 2.0.0-beta.8
  : 4.3.4
  : 4.3.4
  : 4.3.4
  : 1.2.7
  : 4.3.4

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
  

• Language: [all | TypeScript X.X | ES6/7 | ES5]

[ScottSpittle]

this.rows.push(result);
this.rows = [...this.rows]

[ThakkarKhushbu]

@ScottSpittle : It works .. Thanks a lot ..

[JinsPeter]

This happened to me withAngular version 5.2.3.
this.rows.push(...records) did not trigger table change.
I had to do
this.rows = this.rows.concat(records);

[nicknijenhuis]

After updating from 11.1.4 to 12.0.0 suddenly have this issue and this should not be closed. When I updated the underlying datasource of the rows variable by adding records or deleting records the datatable is not updated.

This is not something that should be fixed by resetting the rows variable. Is there anything that changed between those versions that could have caused this?

[mcsky]

I'm trying to hide/display a column dynamically.
Affecting a new array to the rows of my datatable don't render it again, so no change on the column.

Maybe a method should be added to the public API of the datatable component to refresh it mannualy ?
Otherwise any others workaround ?
Thank in advance !

[umang1995]

Hi, I am stuck on the same problem. is there any API to refresh my data table from my ts file.

[ersatish]

In my case issue was due to column header name row property name. You should not use camel casing in header names.

[mitschmidt]

Having the same issue right now - any other suggestions?

[forvy]

this.rows = [...this.rows]; works for a refresh but the page index stay where it is not returned to the first page.

[teja123r]

this.rows = [...this.rows]; will not update the underlying datasource. For it to get updated simple hack is to settimeout this.rows = null for about 50ms or so and then use this.rows=[..this.rows]. Underlying source will get updated.

[enchanter5525]

The following code works for me!! Give it a shot
setTimeout(()=>{
this.valveListToDisplay = [...tableData] ;
}, 0);
this.valveListToDisplay = [...tableData];
Make sure you write the statement twice

[edyrkaj]

You can use this workaround to refresh the content:

import { DatatableComponent } from '@swimlane/ngx-datatable';
....
@ViewChild('ngxDatatable') ngxDatatable: DatatableComponent;

...
// In your code after loading rows data
// simulate client click to reload table
setTimeout(() => {
  this.ngxDatatable.element.click();
, 500);

[danchaseCTS]

Interesting, in the following StackBlitz it works for some reason, anyone know why? The reason I'm here is in my program it does not, but in StackBlitz it worked, causing me to really question things until I saw this post.
https://stackblitz.com/edit/angular-w7j1vb