Vadim Tomashevsky
Vadim Tomashevsky

Reputation: 328

Angular if statement with observable async

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

this.users$ = this.userService.get();
<span *ngIf="!users$ | async">No data</span>

Upvotes: 0

Views: 698

Answers (1)

The Head Rush
The Head Rush

Reputation: 3357

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

Upvotes: 1

Related Questions