Article

Angular AsyncPipe without *ngIf

AOAnonymous One· Feb 20, 20231 min read
  • #Angular
  • #Async Pipe
  • #ngIf

Angular AsyncPipe without *ngIf

You still use *ngIf but you make sure it evaluates truthy by passing an object.

<ng-container *ngIf="{wrap: user$ | async} as wrap">
	{{wrap.user | json}}
</ng-container>

The about code snippet will render even if the user is null because we wrapped it in an object which is truthy.


References

  • https://stackoverflow.com/questions/51556292/how-to-assign-result-of-async-pipe-to-variable-without-ngif-in-angular-6

1 Comment

Sign in to join the conversation.

  • AO
    Anonymous One

    Could use `{auth: user$ | async} as auth` instead of `{wrap: user$ | async} as wrap` to better identify the wrapper is associated with authentication.

Search

Jump to a page, story or project