toolbar.component.html

<!--Navigation-->
<div class="navbar-fixed">

  <nav  role="navigation">

    <div class="nav-wrapper blue ">
      <a [routerLink]="['']" id="logo-container" class="brand-logo">Rails & Angular Auth</a>

      <ul class="right hide-on-med-and-down">

        <li *ngIf="!(authService.userSignedIn$ | async)"> <a (click)="presentAuthDialog()" >LOGIN</a></li>
        <li *ngIf="!(authService.userSignedIn$ | async)"> <a (click)="presentAuthDialog('register')">REGISTER</a></li>

        <li *ngIf="(authService.userSignedIn$ | async)"><a [routerLink]="['/profile']">PROFILE</a></li>
        <li *ngIf="(authService.userSignedIn$ | async)"><a (click)="logOut()">LOGOUT</a></li>

      </ul>

    </div>

  </nav>

</div>

<app-auth-dialog #authDialog ></app-auth-dialog>