angular - how to write correct ngIf condition - is array length is bigger then 1

Question

I have angular code and I put condition like this:

<li *ngIf="carProfiles$.length > 1">

and this works, but this .length is red in my editor and it writes

unresolved variable length

I'm worried about this because no matter this code works it seems I did something wrong. In the ts file:

readonly carProfiles$: Observable<Profile[]>;

and inside constructor:

this.carProfiles$ = this.allProfiles$.pipe(map((profiles) => profiles.filter((p) => ProfileHelper.isCar(p))));

Any help? DO I need to worry about why text.length is red and did I write condition in the correct way?

Answer 1

You are not trying to check an array length. You are trying to check the observable's length (and is not correct) which emits an array. Instead you can first extract the emitting array inside observable by using async pipe, then check for length. This async pipe is subscribing to this Observable in the backgorund and unsubscribing from it.

<li *ngIf="(carProfiles$| async)?.length > 0">