Ionic 2: Verwendung von ViewChild anstelle von app.getComponent

Question

Ich migriere meine ionic 2 App in die RC-Version, in der app.getComponent entfernt wird. In ihren GitHub-Versionshinweisen sagten sie über die Verwendung von ViewChild, wie verwende ich es richtig?

Vor (Arbeits vor RC-Version):

openPage(page) { 
    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); 
} 

Nach:

@Component({ 
    templateUrl: 'build/app.html', 
    queries: { 
    leftMenu: new ViewChild('leftMenu'), 
    nav: new ViewChild('content') 
    } 
}) 

.... 

openPage(page) { 
    // close the menu when clicking a link from the menu 
    this.leftmenu.close(); 
    // navigate to the new page if it is not the current page 
    this.nav.setRoot(page.component); 
} 

Ich versuche, die 'LeftMenu' Komponente ohne Erfolg zu erhalten. Der Fehler, den ich bekommen ist

browser_adapter.js:77 ORIGINAL EXCEPTION: TypeError: Cannot read property 'close' of undefined

Answer 1

Nach wie es in den Conference App getan hat (und es nur ein wenig zu ändern, den Code zu vereinfachen):

import {Component, ViewChild} from '@angular/core'; 
import {ionicBootstrap, ..., Platform, MenuController} from 'ionic-angular'; 
... 

@Component({ 
    templateUrl: 'build/app.html', 
    queries: { 
    nav: new ViewChild('content') 
    } 
}) 
class ConferenceApp { 
    static get parameters() { 
    return [[...], [Platform], [MenuController]] 
    } 

    constructor(..., platform, menu) { 
    this.menu = menu; 

    // Call any initial plugins when ready 
    platform.ready().then(() => { 
     ... 
    }); 

openPage(page) { 
    this.menu.close(); 
    this.nav.setRoot(page);  
    } 
} 

ionicBootstrap(ConferenceApp, [...], { 
    // config 
}); 

So wie weit ich weiß, können Sie die Instanz MenuController, um die close() Methode auszuführen und das Seitenmenü auszublenden.

Wenn Sie die TypeScript-Version dieses Codes benötigen, fügen Sie einfach einen Kommentar hinzu und ich werde die Antwort aktualisieren, wollte sie nicht hinzufügen, um die Antwort kurz zu halten.