First I found a solution at:

https://stackoverflow.com/questions/49296784/angular-ngif-variable-with-async-pipe-multiple-conditions

 

<ng-container *ngIf="(contacts$ | async)?.length > 0 && (contacts$ | async) as contacts">


But in Angular 9 this results in 2 subscriptions, so I changed the template to:

<ng-container *ngIf="(contacts$ | async) as contacts">


And add a filter inside the observable pipe function, to only fire when the array contains at least 1 item TypeScript code

contacts$.pipe(


      filter((contacts) => contacts!== null && contacts.length > 0))


);


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.