NgOnInit not invoked on a header component

Question

I have an Angular application which uses 2 components called Header and Footer. The Header component contains a ngOnInit method:

    ngOnInit() {
    this.isAuthenticated = AppSession.isAuthenticated();
}

However when I try to load a page this method is not called but I see the header and footer set on the page.
The Header contains a Login button which launches a popup for the user to provides his/her credentials. On a successful login, the user is supposed to stay on the same page but the Header should change from displaying the Login button to showing an MyAccount button. A snippet of the Header is:

 <li *ngIf="!isAuthenticated">               
          <a class="waves-effect waves-light btn blue darken-5" (click)="onLoginClick()">Login</a>
           </li>
        <li *ngIf="isAuthenticated"><a class="blue-text text-darken-5" (click)="onMyAccountClick()">My Account</a></li>
        <li *ngIf="isAuthenticated"><a class="blue-text text-darken-5" (click)="onLogoutClick()">Logout</a></li>

Any help with this is appreciated.