Angular if statement with observable async

Question

I have tried this code bellow and it doesn't work

this.users$ = this.userService.get();

<span *ngIf="!users$ | async">No data</span>

I've expanded my comment into an answer and explanation, if you care to accept it. — The Head Rush
– The Head Rush, Commented Dec 7, 2020 at 12:03

The Head Rush · Accepted Answer · 2020-12-07 12:02:44Z

1

This is the result of misunderstanding the negation operator, ! in template syntax.

In the provided code sample, !users$ | async examines the users$ observable for nullness and then applies the async pipe, making the observable's emitted value available to the template.

Because that observable is the result of an api call, it can never be null. You want to examine the emitted value from that observable for nullness, so you instead need to wrap the entire expression in parenthesis !(users$ | async).

answered Dec 7, 2020 at 12:02

The Head Rush

3,3763 gold badges30 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular if statement with observable async

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related