Access a variable from another Component (Ionic/Co

I'm trying to access a variable from another component in order to check if the user is logged in or not.

The application does the follow:

If user is loggedin (function in login.ts) user will not be null anymore therefor [disabled]=!user wont be true anymore and the first year field will be activated.

I Implemented the following stackoverflow solution but that did not work: Angular 2, Cant able to access a variable in one Component from another Component

Here is my code that is related to this problem:

          ` https://plnkr.co/edit/xzHazahrSHErJa9K0ceb?p=preview `

Thank you!

Below is the sample code where we will pass data from home page to about page on navigation. Home page will have a button Go to about page, on clicking that button, your name will be passed to about page through navParams and it will be displayed in About page. You can also find the working version here

home.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {appService} from '../../providers/app.service';
import {AboutPage} from '../../pages/about/about';
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  aboutPage : any;

  constructor(public navCtrl: NavController, public appService : appService) {
    this.aboutPage=AboutPage;
  }

  goToAbout(){
    this.navCtrl.push(this.aboutPage, {
            userData: "Ajay kumar singh"
        });
  }

}

In Home page, use navParams to receive the values you sent from sign up page.

userData : any;
constructor(public navParams: NavParams){
   this.userData= navParams.data.userData;
}

home.html

<ion-header>
  <ion-navbar>
    <ion-title>Home</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <h2>Welcome to Ionic!</h2>
  <p>
    This starter project comes with simple tabs-based layout for apps
    that are going to primarily use a Tabbed UI.
  </p>
  <p>
    Take a look at the <code>pages/</code> directory to add or change tabs,
    update any existing page or create new pages. {{appService.service}}
  </p>

  <button ion-button (click)="goToAbout()">Go to About Page</button>
</ion-content>

about.ts

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';

@Component({
  selector: 'page-about',
  templateUrl: 'about.html'
})
export class AboutPage {
  userData : any;
  constructor(public navCtrl: NavController, navParams : NavParams) {
    this.userData= navParams.data.userData;
  }

}

about.html

<ion-header>
  <ion-navbar>
    <ion-title>
      About
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  {{userData}}
</ion-content>