title: Dynamically Update Side Menu in Ionic 2
body: <p>I have a side menu in ionic 2 which I am trying to update after user logs in. I am using Events from ionic-angular. Here is what I have done.</p>
  
  <p>app.component.ts</p>
  
  <pre><code>import { Component, ViewChild } from '@angular/core';
  import { Platform, Nav, AlertController, MenuController, Events } from 'ionic-angular';
  import { HomePage } from '../pages/home/home';
  
  @Component({
    templateUrl: 'app.html'
  })
  export class MyApp {
  
    rootPage:any = HomePage;
    logoutAlert:any;
    currentUser:any;
  
    @ViewChild('nav') nav: Nav;
  
    constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, public storage: Storage, public alertCtrl: AlertController, public menuCtrl: MenuController, public events: Events) {
  
      this.currentUser = {
        name: "Guest",
        username: "not logged in"
      };
  
      this.logoutAlert = this.alertCtrl.create({
        message: "Sure you want to log out?",
        buttons: [{text: "Yes", handler: () =&gt; {
          this.logoutUser();
        }}, {text:"No", role: "cancel"}]
      });
  
      this.menuCtrl.enable(false);
  
      platform.ready().then(() =&gt; {
        // Okay, so the platform is ready and our plugins are available.
        // Here you can do any higher level native things you might need.
        statusBar.styleDefault();
        splashScreen.hide();
      });
    }
  
    ionViewWillLoad() {
  
      this.events.subscribe("userloggedin", (user) =&gt; {
          this.currentUser = JSON.parse(user);
      });
  
    }
  </code></pre>
  
  <p>app.html</p>
  
  <pre><code>&lt;ion-menu [content]="content"&gt;
      &lt;ion-item&gt;
          &lt;ion-avatar&gt;
              &lt;img src="../assets/letters/{{currentUser.name}}.svg"&gt;
          &lt;/ion-avatar&gt;
          &lt;p&gt;
              {{currentUser.username}}
          &lt;/p&gt;
      &lt;/ion-item&gt;
  &lt;/ion-menu&gt;
  
  &lt;ion-nav id="nav" [root]="rootPage" #content&gt;&lt;/ion-nav&gt;
  </code></pre>
  
  <p>home.ts</p>
  
  <pre><code>import { Component, ViewChild } from '@angular/core';
  import { FormBuilder, FormControl, FormGroup } from '@angular/forms';
  import { NavController, Slides, LoadingController, Events } from 'ionic-angular';
  import { Storage } from '@ionic/storage';
  import { HttpProvider } from '../../providers/http/http';
  import { TabsPage } from '../tabs/tabs';
  
  @Component({
    selector: 'page-home',
    templateUrl: 'home.html'
  })
  export class HomePage {
  
      @ViewChild('signSlides') signSlides: Slides;
  
      currentUser: any;
      loading:any;
      signinForm:any;
  
    constructor(public navCtrl: NavController,public formBuilder: FormBuilder, public storage: Storage, public httpProvider: HttpProvider, public loadingCtrl: LoadingController, public events: Events) {
      this.signinForm = formBuilder.group({
          email: [''],
          password: ['']
      });
  
      this.loading = this.loadingCtrl.create({
          content: "&lt;ion-spinner&gt;&lt;/ion-spinner&gt;"
      });
    }
  
    signinUser() {
      let params = {
          username: this.signinForm.value.email,
          password: this.signinForm.value.password
      };
      this.httpProvider.loginUser(params).subscribe(
          results =&gt; {
              this.loading.present();
              this.currentUser = results['_body'];
          },
  
          err =&gt; {
              alert("Oops! An error occured!");
          },
          () =&gt; {
              this.storage.set("currentUser", this.currentUser);
              this.loading.dismiss();
              this.navCtrl.setRoot(TabsPage);
          }
      );
    }
  
      this.httpProvider.registerUser(params).subscribe(
          results =&gt; {
              this.loading.present();
              this.currentUser = results['_body'];
          },
          err =&gt; {
              alert("Oops! An error occured!");
          },
          () =&gt; {
              this.storage.set("currentUser", this.currentUser);
          this.events.publish("userloggedin", this.currentUser);
              this.loading.dismiss();
              this.navCtrl.setRoot(TabsPage);
          }
      );
  
    }
  
    firstLetter(s:string) {
      s = s.toLowerCase();
      return s.charAt(0);
    }
  
  }
  </code></pre>
  
  <p>I have tried putting events.subscribe in ionViewDidLoad, ionViewDidEnter and ngOnInit but nothing has worked for me. The data from home.ts is being saved in the storage but I can't figure out why doesn't it upadte in the ionic menu.</p>