title: Ionic 2 modify a variable in app.js from child page
body: <p>Hi I am learning Ionic 2 and I have a requirement to change a variable in Ionic 2 app.js which is the root controller I believe. </p>
  
  <p>I started a new app using </p>
  
  <p>ionic start myApp tutorial --v2</p>
  
  <p>and this is my app.html</p>
  
  <pre><code>&lt;ion-menu id="leftMenu" [content]="content"&gt;
    &lt;ion-content&gt;
      &lt;ion-item class="menu-background"&gt;
          &lt;div class="welcome-div"&gt;
            &lt;img [src]="pictureURL" class="avatar-image"/&gt;
            &lt;span class="welcome-message"&gt;Welcome {{userName}}&lt;/span&gt;
          &lt;/div&gt;
      &lt;/ion-item&gt;
      &lt;ion-list&gt;
        &lt;button class="asbestos" ion-item *ngFor="#p of pages" (click)="openPage(p)"&gt;
          {{p.title}}
        &lt;/button&gt;
      &lt;/ion-list&gt;
      &lt;div&gt;
        &lt;p class="copyright asbestos"&gt;&amp;copy; 2016. All rights reserved&lt;/p&gt;
      &lt;/div&gt;
    &lt;/ion-content&gt;
  
  &lt;/ion-menu&gt;
  
  &lt;ion-nav id="nav" [root]="rootPage" #content swipe-back-enabled="false"&gt;&lt;/ion-nav&gt;
  </code></pre>
  
  <p>and this is my app.js</p>
  
  <pre><code>import {App, IonicApp, Platform} from 'ionic-framework/ionic';
  import {Home} from './pages/home/home';
  import {Status} from './pages/status/status';
  import {Wallet} from './pages/wallet/wallet';
  import {History} from './pages/history/history';
  import {EarnMoney} from './pages/earnmoney/earnmoney';
  import {ContactUs} from './pages/contactus/contactus';
  import {Login} from './pages/login/login';
  
  
  @App({
    templateUrl: 'build/app.html'
    config: {} // http://ionicframework.com/docs/v2/api/config/Config/
  })
  class MyApp {
    static get parameters() {
      return [[IonicApp], [Platform]];
    }
  
    constructor(app, platform) {
      // set up our app
      this.app = app;
      this.platform = platform;
      this.initializeApp();
  
      // set our app's pages
      this.pages = [
        { title: 'Home', component: Home },
        { title: 'Wallet', component: Wallet},
        { title: 'Status', component: Status},
        { title: 'History', component: History},
        { title: 'Earn Money', component: EarnMoney},
        { title: 'Contact Us', component: ContactUs}
      ];
  
      // make HelloIonicPage the root (or first) page
      this.rootPage = Login;
    }
  
    initializeApp() {
      this.platform.ready().then(() =&gt; {
        // The platform is now ready. Note: if this callback fails to fire, follow
        // the Troubleshooting guide for a number of possible solutions:
        //
        // Okay, so the platform is ready and our plugins are available.
        // Here you can do any higher level native things you might need.
        //
        // First, let's hide the keyboard accessory bar (only works natively) since
        // that's a better default:
        //
        //
        // For example, we might change the StatusBar color. This one below is
        // good for light backgrounds and dark text;
        if (window.StatusBar) {
          window.StatusBar.styleDefault();
        }
      });
    }
  
    setUser(user) {
        this.userName = user.name;
        this.pictureURL = user.picture.data.url;
    }
  
    openPage(page) {
      // close the menu when clicking a link from the menu
      this.app.getComponent('leftMenu').close();
      // navigate to the new page if it is not the current page
      let nav = this.app.getComponent('nav');
      nav.setRoot(page.component);
    }
  }
  </code></pre>
  
  <p>this is one of my child pages javascript file</p>
  
  <pre><code>import {Page, NavController} from 'ionic-framework/ionic';
  import {PhoneVerify} from '../phoneVerify/phoneVerify';
  import {Home} from '../home/home';
  
  @Page({
    templateUrl: 'build/pages/login/login.html'
  })
  export class Login {
    static get parameters() {
      return [[NavController]];
    } 
  
    constructor(nav) {
      this.nav = nav;
    }
  }
  </code></pre>
  
  <p>I am trying to call the setUser method in the app.js from the login.js please advise how do I do that.</p>