Multiple Async Pipes in *ngIf


Stay updated with my tutorials. Also, I will delight you with some bonus content.

For example you want to show something based on two async values. Assume, we have 2 Observables:

user$ =;
product$ =;

We can show something based on both these values by using the nested ng-containers:

<ng-container *ngIf="user$ as user">
  <ng-container *ngIf="product$ as product">  
    <div>We have {{product | json}} and {{user | json}}</div>

When product and user are both exist we will show the div.

comments powered by Disqus