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


#1

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>

#2

Changed it to *ngIf and it seems to work.