How to define a variable in a *ngIf with a async pipe and also check on length of the array

 

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))


);