Angular 2 How to Use ngif Display a loading message
Example
If our component is not ready and waiting for data from server, then we can add loader using *ngIf. Steps:
First declare a boolean:
loading: boolean = false;
Next, in your component add a lifecycle hook called ngOnInit
ngOnInit() {
this.loading = true;
}
and after you get complete data from server set you loading boolean to false.
this.loading=false;
In your html template use *ngIf with the loading property:
<div *ngIf="loading" class="progress">
<div class="progress-bar info" style="width: 125%;"></div>
</div>
