How to put a loading function while the content is still being fetched from the api

I need a way to tell the user that content is being fetched and after the content has been fetched the loader to disappear

Easiest way is to use a property in the controller, then use an *ngIf in the view:


export class Page {
   this.loading = false;

       this.loading = true;
       service.loadMore().then(() => this.loading = false);


   <div *ngIf="loading">Loading...</div>
   <div *ngIf=!loading"> ... </div>

I would argue even simpler than the previous advice would be to use the Ionic LoadingController.


What I do instead, is fake loading progression by putting in “empty state” styles…kind of like how Facebook and Google do. They’ll populate an item or two but fill them with squares where content will be.