title: Update Side menu after logging in ionic 5
body: <p>I have to update the data in sidemenu after user logs in. I'm using Ionic 5. This is my app.component.ts which has the side menu.</p>
  <pre><code>   import { Component, OnInit, Inject, NgZone } from '@angular/core';
     import { Router } from '@angular/router';
     import { Platform } from '@ionic/angular';
     import { SplashScreen } from '@ionic-native/splash-screen/ngx';
     import { StatusBar } from '@ionic-native/status-bar/ngx';
     import { NavController } from '@ionic/angular';
     
     import { TranslateService } from '@ngx-translate/core';
     import { APP_CONFIG, AppConfig } from './app.config';
     import { MyEvent } from 'src/services/myevent.services';
     import { Constants } from 'src/models/contants.models';
     import { ApisService } from 'src/app/services/apis.service';
     import { UtilService } from 'src/app/services/util.service';
     import { Subject } from 'rxjs';
     
     
     @Component({
       selector: 'app-root',
       templateUrl: 'app.component.html',
       styleUrls: ['app.component.scss']
     })
     export class AppComponent implements OnInit {
       rtlSide = &quot;left&quot;;
       showLogout:any=false;
       username: any;
       userno: any; 
       public selectedIndex = 0;
       public appPages = [
         {
           title: 'Home',
           sub_title: 'Yummy Foods',
           url: '/home',
           icon: 'zmdi zmdi-store ion-text-start'
         },
         {
           title: 'My Orders',
           sub_title: 'Foods to your tummy',
           url: '/myorders',
           icon: 'zmdi zmdi-cutlery ion-text-start'
         },
         {
           title: 'My Profile',
           sub_title: 'Who am i?',
           url: '/myprofile',
           icon: 'zmdi zmdi-pin-account ion-text-start'
         },
         {
           title: 'Reviews',
           sub_title: 'Hows food?',
           url: '/review',
           icon: 'zmdi zmdi-ticket-star ion-text-start'
         },
         {
           title: 'Contact Us',
           sub_title: 'Let us know your queries and feedbacks',
           url: '/contact',
           icon: 'zmdi zmdi-comment-text ion-text-start'
         },
         {
           title: 'Exit',
           sub_title: 'Come back soon',
           icon: 'zmdi zmdi-alert-triangle ion-text-start'
         }
       ];
     
       constructor(
         @Inject(APP_CONFIG) public config: AppConfig,
         private platform: Platform, private navCtrl: NavController,
         private splashScreen: SplashScreen,
         private statusBar: StatusBar,
         private ngZone: NgZone,
         private util: UtilService,
         private apis: ApisService,
         private translate: TranslateService, private myEvent: MyEvent) {
         this.initializeApp();
         this.myEvent.getLanguageObservable().subscribe(value =&gt; {
           this.navCtrl.navigateRoot(['./']);
           this.globalize(value);
         });
       }
     
       loadProfile() {
         this.apis.checkAuth().then((user) =&gt; {
           if (user) {
            this.getProfile();
           }
         }).catch(error =&gt; {
           console.log(error);
         });
       }
     
       
     
       initializeApp() {
         this.platform.ready().then(() =&gt; {
           this.statusBar.styleDefault();
           this.splashScreen.hide();
     
           let defaultLang = window.localStorage.getItem(Constants.KEY_DEFAULT_LANGUAGE);
           this.globalize(defaultLang);
         });
       }
     
       globalize(languagePriority) {
         this.translate.setDefaultLang(&quot;en&quot;);
         let defaultLangCode = this.config.availableLanguages[0].code;
         this.translate.use(languagePriority &amp;&amp; languagePriority.length ? languagePriority : defaultLangCode);
         this.setDirectionAccordingly(languagePriority &amp;&amp; languagePriority.length ? languagePriority : defaultLangCode);
       }
     
       setDirectionAccordingly(lang: string) {
         switch (lang) {
           case 'ar': {
             this.rtlSide = &quot;rtl&quot;;
             break;
           }
           default: {
             this.rtlSide = &quot;ltr&quot;;
             break;
           }
         }
       }
     
       ngOnInit() {
         const path = window.location.pathname.split('folder/')[1];
         if (path !== undefined) {
           this.selectedIndex = this.appPages.findIndex(page =&gt; page.title.toLowerCase() === path.toLowerCase());
         }
         this.getProfile();
         
       }
     
       ionViewWillEnter() {
         this.getProfile();
       }
     
       ionViewDidLoad()
       {
         this.getProfile();
       }
     
       my_profile() {
         this.navCtrl.navigateRoot(['./myprofile']);
       }
     
       getProfile() {
         this.apis.getMyProfile(localStorage.getItem('uid')).then((data: any) =&gt; {
           console.log('userdata', data);
           if (data) {
             this.ngZone.run(() =&gt; {
               this.username = data.fullname;
               this.userno = data.phone;
             });
             
           }
         }).catch(error =&gt; {
           console.log(error);
         });
       }
     
     }
  </code></pre>
  <p>I need to update name and phone number in side menu after user logs in. This is the login method in signin.page.ts</p>
  <pre><code>       onLogin(form: NgForm) {
         console.log('form', form);
         this.submitted = true;
         if (form.valid) {
           const emailfilter = /^[\w._-]+[+]?[\w._-]+@[\w.-]+\.[a-zA-Z]{2,6}$/;
           if (!emailfilter.test(this.login.email)) {
             this.util.showToast(this.util.translate('Please enter valid email'), 'danger', 'bottom');
             return false;
           }
           console.log('login');
           this.isLogin = true;
           this.api.login(this.login.email, this.login.password).then((userData) =&gt; {
             console.log(userData);
             this.api.getProfile(userData.uid).then((info) =&gt; {
               console.log(info);
               if (info &amp;&amp; info.status === 'active') {
                 localStorage.setItem('uid', userData.uid);
                 localStorage.setItem('help', userData.uid);
                 localStorage.setItem('uname', userData.fullname);
                 localStorage.setItem('unumber', userData.phone);
                 this.isLogin = false;
                 this.util.publishLoggedIn('LoggedIn');
                 // this.navCtrl.back();
                 this.router.navigate(['home']);
               } else {
                 Swal.fire({
                   title: this.util.translate('Error'),
                   text: this.util.translate('Your are blocked please contact administrator'),
                   icon: 'error',
                   showConfirmButton: true,
                   showCancelButton: true,
                   confirmButtonText: this.util.translate('Need Help?'),
                   backdrop: false,
                   background: 'white'
                 }).then(data =&gt; {
                   if (data &amp;&amp; data.value) {
                     localStorage.setItem('help', userData.uid);
                     this.router.navigate(['inbox']);
                   }
                 });
               }
             }).catch(err =&gt; {
               console.log(err);
               this.util.showToast(`${err}`, 'danger', 'bottom');
             });
           }).catch(err =&gt; {
             if (err) {
               console.log(err);
               this.util.showToast(`${err}`, 'danger', 'bottom');
             }
           }).then(el =&gt; this.isLogin = false);
         }
       }
     
  </code></pre>
  <p>I thought of using events but in ionic 5 events API is deprecated. Can anyone help me on this?</p>