Async pipe not working with Subject

Question

I have the following BehaviorSubject in a service:

  isAuthenticated = new BehaviorSubject(false);

And I am using it as follows

Answer 1

I thought of posting a solution using ng-if-else which is maybe even more intuitive in your particular case:

<li class="login-button" *ngIf="(authenticated | async); else unauthenticated">
  <a>Logged in</a>
</li>
<ng-template #unauthenticated>
  <a (click)="authenticate()">Log in</a>
</ng-template>

Alternatively you could puth both cases inside a ng-template:

<li class="login-button" *ngIf="(authenticated | async); then authenticated else unauthenticated"></li>
<ng-template #authenticated ><a>Logged in</a></ng-template>
<ng-template #unauthenticated><a (click)="authenticate()">Log in</a></ng-template>

Hope it is of any use to other people ending up here.

Answer 2

I suspect its the order of operations - you need parenthesis around your subscription:

<li class="login-button" *ngIf="!(authenticated | async)">