Không có nhà cung cấp nào cho NavController

Question

tôi đã khởi động ứng dụng ionic 2 từ bộ khởi động sidemenu. Bây giờ tôi muốn di chuyển mã được tạo ra trong thành phần ứng dụng (menu) vào một thư mục và viết một thành phần nhà thay thế. Khi tôi chạy ứng dụng, nó cho tôi thấy lỗi này:

NGOẠI TRỪ GỐC: Không có nhà cung cấp cho NavController!

Mã cho app.component của tôi là:

import { Component } from '@angular/core'; 
import { NavController, Platform } from 'ionic-angular'; 
import { StatusBar } from 'ionic-native'; 

import { Login } from '../pages/login/login'; 

@Component({ 
    templateUrl: 'app.html' 
}) 
export class MyApp { 

    nav: NavController; 

    constructor(public platform: Platform, nav: NavController) { 
    this.nav = nav; 
    this.initializeApp(); 
    } 

    initializeApp() { 
    this.platform.ready().then(() => { 
     // 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(); 
    }); 
    } 

    registerUserWithFacebook(){ 
    console.log('Facebook'); 
    //this.nav.setRoot(pantryList); 
    } 

    registerUserWithGoogle() { 
    console.log('Google'); 
    //this.nav.setRoot(pantryList); 
    } 

    openSignUpPage(){ 
    console.log('Signup'); 
    //this.nav.setRoot(Signup); 
    } 

    openLoginPage(){ 
    console.log('Login'); 
    this.nav.push(Login); 
    } 

    openTermsOfService(){ 
    console.log('Terms of service'); 
    } 
} 

Và tôi muốn chuyển hướng đến trình đơn của tôi (sidemenu) page:

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

import { pantryList } from '../pantryList/pantryList'; 

@Component({ 
    templateUrl: "login.html" 
}) 
export class Login { 

    email: string; 
    password: string; 

    constructor(public navCtrl: NavController) { 
    } 

    onLogin() { 
     this.navCtrl.setRoot(pantryList); 
    }  
} 

Answer 1

tôi giải quyết điều này bằng một cách giải quyết. Tôi đã đọc và tôi đã tìm thấy this bài đăng hỏi về tương tự.

Vì vậy, tôi chỉ cần thay đổi app.html của tôi vào đây:

<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav> 

Và app.component của tôi vào đây:

@Component({ 
    templateUrl: 'app.html' 
}) 
export class MyApp { 
    @ViewChild('content') nav: Nav; 

    rootPage: any = Home; 
    ... 
} 

Bây giờ khi tôi chuyển hướng trong trang nhà của tôi, tôi không có bất kỳ vấn đề .

Answer 2

Buộc điều đó để làm việc theo cách tiếp

constructor(
    protected app: App 
) { 

... 

    get navCtrl(): NavController { 
    return this.app.getActiveNav(); 
    }