How to ngIf in angular 17 with async pipe as a variable

Issue

I have this in Angular 16

<div *ngIf="post$ | async as post">
  <h1>{{ post.attributes.title }}</h1>
</div>

Type of post$ is Observable<ContentFile<BlogPost | Record<string, never>>>

I want to rewrite this with the new built-in syntax for control flow.

@if(post$|async as post) {

}

as post part results in

Parser Error: Unexpected token 'as' at column 13 in [post$|async as post] in ...

How to get around this?

Solution

You're missing the semi colon :

@if(post$ | async; as post) {

}

Answered By - Matthieu Riegler