Issue: Angular: Datatable data disappears from table on clicking sort or on search

Problem: Upon loading data from http call to a datatable, it disappers on clicking the table header or searching

Possible cause: Data table caches the data as null even before http call occurs and it is not aware that new data has been updated

Solution: Declare a boolean variable in the class as DataLoaded = false and reassign the variable to true inside the http subscribe block.

inside the <TABLE> directive use *ngIf = "DataLoaded" as <TABLE  *ngIf = "DataLoaded">

This will ensure that data table initializes only after the data is loaded.