[Angular] Show a loading indicator in Angular using *ngIf/else, the as keyword and the async pipe

The network may be unreliable and loading data may take time. Thus it is important to give the user some feedback about what's going on as fast as possible. In this lesson we learn how to leverage the else block of the *ngIf directive to show a simple loading indicator.

    <div *ngIf="buttonClicked">

      <div *ngIf="person$ | async as person; else personLoading">

        Name: {{ person.name }} <br />

        Twitter: {{ person.twitter }}

      </div>

      <ng-template #personLoading>

        Loading person...

      </ng-template>

    </div>

巴特西

[Angular] Show a loading indicator in Angular using *ngIf/else, the as keyword and the async pipe

最新文章

热门文章