Data disappearing when touching table

skyline7349

So Im able to load the table with basic configuration. However when i try to sort or search all the data disappears and it says "No data available in table" I dont see any errors in console.

configs: Array<any>;

  constructor(private hmConfigsService: HMConfigsService) {}

  ngOnInit() {
    this.hmConfigsService.get('system').subscribe((configs: Array<any>) => {
      this.configs = configs;
    });
  }

<table datatable class="row-border hover">
  <thead>
    <tr>
      <th>Actions</th>
      <th>ID</th>
      <th>System</th>
      <th>Hostname</th>
      <th>System Desc</th>
      <th>Enabled</th>
      <th>Conact</th>
      <th>Deleted</th>
      <th>Update Time</th>
      <th>Updated By</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let config of configs">
      <td></td>
      <td>{{config.ID}}</td>
      <td>{{config.sys}}</td>
      <td>{{config.hostname}}</td>
      <td>{{config.sys_description}}</td>
      <td>{{config.hm_enabled}}</td>
      <td>{{config.contact}}</td>
      <td>{{config.deleted}}</td>
      <td>{{config.update_time}}</td>
      <td>{{config.updated_by}}</td>

    </tr>

  </tbody>
</table>

kthorngren

Please post your Datatables init code.

If Datatables initializes before the above script then it doesn't know about the data in the table and sorting and searching won't work as expected. If it initializes after then it will load the table data into its data cache.

What is the order of operations on your page?

Can you post a link to your page for debugging?

Kevin

skyline7349

Its in angular and i set it up exactly like in this tutorial https://l-lin.github.io/angular-datatables/#/getting-started

Unfortunately i cant post a link because its only on local for work.

kthorngren

I'm not familiar with Angular but it seems this code is just to build the table:

  ngOnInit() {
    this.hmConfigsService.get('system').subscribe((configs: Array<any>) => {
      this.configs = configs;
    });
  }

Can you show the Datatables config?

Do you have server side processing enabled?

If so then your server script is responsible for the sorting and searching operations.

Kevin