Late data-bound ion-list, show message when empty?

I searched Google for ways to display “no items” and found the following ng-if code. It sort of works… but the problem is that Items is set a few seconds later by a REST API. So,“No items” first shown while API result is being retrieved, and when there are items and set later, “No items” is still displayed at the bottom of the list. How to handle this properly?

Basically there are three cases:

  1. Getting items. Items is not set yet.
  2. Got result. There are items.
  3. Got result. There were no items.
  <ion-list>
    <ion-item *ngFor="let item of Items">
       <!-- display the item -->
    </ion-item>
    <ion-item ng-if="Items.length <= 0 || !Items">
      No items.
    </ion-item>
  </ion-list>

Changed it to *ngIf and it seems to work.

Instead of that, You can add loading[that is ion-loading] until you got response from restAPI, Once you got the response,Check the response. Based on the items you can display “No-items” or “Item-list”.