Ionic 2-Nav未定義

Question

我正在嘗試將導航添加到Ionic 2應用程序中的app.component.ts文件中。 由於某種原因，我收到未定義nav的錯誤。

添加NavController是選項，因為它會說NavController沒有提供程序。

我收到的錯誤是：

本機：嘗試調用Facebook.browserInit，但Cordova不可用。 確保包含cordova.js或在設備/模擬器main.js中運行（416,9）
Angular在開發模式下運行。 調用enableProdMode（）以啟用生產模式。 main.js（3511,5）
本機：嘗試調用NativeStorage.getItem，但Cordova不可用。 確保包含cordova.js或在設備/模擬器main.js中運行（416,9）
本機：嘗試調用StatusBar.styleDefault，但Cordova不可用。 確保包含cordova.js或在設備/模擬器main.js中運行（416,9）
例外：未發現（承諾）：
TypeError：無法獲取未定義或空引用的屬性“ nav” TypeError：無法獲取未定義或空引用的屬性“ nav”
在匿名函數中（http：‍ // localhost：8100 / build / main.js：125439：17）
在t.prototype.invoke（http：‍ // localhost：8100 / build / polyfills.js：3：9569）
在onInvoke（http：‍ // localhost：8100 / build / main.js：38701：21）
在t.prototype.invoke（http：‍ // localhost：8100 / build / polyfills.js：3：9569）
在e.prototype.run（http：‍ // localhost：8100 / build / polyfills.js：3：6993）
在匿名功能（http：‍ // localhost：8100 / build / polyfills.js：3：4652）
在t.prototype.invokeTask（http：‍ // localhost：8100 / build / polyfills.js：3：10175）
在onInvokeTask（http：‍ // localhost：8100 / build / main.js：38692：21）
在t.prototype.invokeTask（http：‍ // localhost：8100 / build / polyfills.js：3：10175）
在e.prototype.runTask（http：‍ // localhost：8100 / build / polyfills.js：3：7611）
在我（http：‍ // localhost：8100 / build / polyfills.js：3：3700）
在調用時（http：‍ // localhost：8100 / build / polyfills.js：3：11431）
main.js（78327,9）
原始堆棧：main.js（78332,13）
錯誤：未捕獲（已承諾）：
TypeError：無法獲取未定義或空引用的屬性“ nav”
TypeError：無法在匿名函數中獲取未定義或空引用的屬性'nav'（http：‍ // localhost：8100 / build / main.js：125439：17）
在t.prototype.invoke（http：‍ // localhost：8100 / build / polyfills.js：3：9569）
在onInvoke（http：‍ // localhost：8100 / build / main.js：38701：21）
在t.prototype.invoke（http：‍ // localhost：8100 / build / polyfills.js：3：9569）
在e.prototype.run（http：‍ // localhost：8100 / build / polyfills.js：3：6993）
在匿名功能（http：‍ // localhost：8100 / build / polyfills.js：3：4652）
在t.prototype.invokeTask（http：‍ // localhost：8100 / build / polyfills.js：3：10175）
在onInvokeTask（http：‍ // localhost：8100 / build / main.js：38692：21）
在t.prototype.invokeTask（http：‍ // localhost：8100 / build / polyfills.js：3：10175）
在e.prototype.runTask（http：‍ // localhost：8100 / build / polyfills.js：3：7611）
在我（http：‍ // localhost：8100 / build / polyfills.js：3：3700）
在調用時（http：‍ // localhost：8100 / build / polyfills.js：3：11431）
在v（http：‍ // localhost：8100 / build / polyfills.js：3：4856）
在s（http：‍ // localhost：8100 / build / polyfills.js：3：4283）
在匿名函數中（http：‍ // localhost：8100 / build / polyfills.js：3：4690）
在t.prototype.invokeTask（http：‍ // localhost：8100 / build / polyfills.js：3：10175）
在onInvokeTask（http：‍ // localhost：8100 / build / main.js：38692：21）
在t.prototype.invokeTask（http：‍ // localhost：8100 / build / polyfills.js：3：10175）
在e.prototype.runTask（http：‍ // localhost：8100 / build / polyfills.js：3：7611）
在我（http：‍ // localhost：8100 / build / polyfills.js：3：3700）
在調用時（http：‍ // localhost：8100 / build / polyfills.js：3：11431）
main.js（78333,13）

我正在使用的代碼：

import { Component, ViewChild } from '@angular/core';
import { Nav, Platform } from 'ionic-angular';
import { StatusBar, Splashscreen, NativeStorage, Facebook } from 'ionic-native';

import { HomePage } from '../pages/home/home';
import { LoginPage } from '../pages/login/login';

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

  rootPage = LoginPage;

  constructor(private platform: Platform) {
    this.InitliazeApp();
  }

  InitliazeApp() {
    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.

      NativeStorage.getItem('user')
        .then(function (data) {
          this.nav.setRoot(HomePage);
          Splashscreen.hide();
        }, function (error) {
          this.nav.setRoot(LoginPage);
          Splashscreen.hide();
        });

      StatusBar.styleDefault();
    });
  }
}

Answer 1

在Ionic2中，通常通過將NavController添加到構造函數來添加導航。 然后使用依賴項注入進行注入。

constructor(public navCtrl: NavController)

Answer 2

將以下內容導入app.component.ts

從'ionic-angular'導入{Nav，NavController，Platform};

在構造函數中添加以下代碼

構造函數（公共navCtrl：NavController）