离子2:例外:没有NavController的提供程序

本文介绍了离子2:例外:没有NavController的提供程序的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我的离子2/角2应用程序有问题.

i have a problem with my ionic 2/angular 2 app.

我有一个app.ts，其中的身份验证"部分是工具集.

I got an app.ts where the hole "auth" part is implementet.

代码如下:

 import {Nav, Platform, Modal, ionicBootstrap} from "ionic-angular";
import {NavController} from "ionic-angular/index";
import {StatusBar} from "ionic-native";
import {Component, ViewChild} from "@angular/core";
import {AngularFire, FirebaseListObservable, FIREBASE_PROVIDERS, defaultFirebase} from "angularfire2";
import {HomePage} from "./pages/home/home";
import {AuthPage} from "./pages/auth/home/home";

@Component({
  templateUrl: "build/app.html",
})

class MyApp {
  @ViewChild(Nav) nav: Nav;

  authInfo: any;
  rootPage: any = HomePage;
  pages: Array<{title: string, component: any}>;

  constructor(private platform: Platform, private navCtrl: NavController, private af: AngularFire) {
    this.initializeApp();

    this.pages = [
      { title: "Home", component: HomePage }
    ];

  }

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

  openPage(page) {
    this.nav.setRoot(page.component);
  }

  ngOnInit() {
    this.af.auth.subscribe(data => {
      if (data) {
        this.authInfo = data;
      } else {
        this.authInfo = null;
        this.showLoginModal();
      }
    });
  }

  logout() {
    if (this.authInfo) {
      this.af.auth.logout();
      return;
    }
  }

  showLoginModal() {
    let loginPage = Modal.create(AuthPage);
    this.navCtrl.present(loginPage);
  }
}

但是现在，当我尝试运行该应用程序时，我收到以下消息:

But now, when i try to run the app i get this message:

ORIGINAL EXCEPTION: No provider for NavController

您知道如何解决此问题吗?谢谢！

Do you have any idea how to solve this problem? Thanks!

推荐答案

您不能通过构造函数将NavController注入Root组件中.

You can not inject a NavController in a Root component via a constructor.

因此，基本上，您可以not进行如下操作:-

So, basically you can not do something like below:-

constructor(private nav: NavController){
}

这是注入NavController的方式

This is how you can inject a NavController

@Controller({
  ....
})
class MyApp{
  @ViewChild('nav') nav: NavController;
  ....
  ....
  constructor(...){ // See, no NavController here
  }
  ....
}

这就是Ionic文档必须说的.

And this is what Ionic docs has to say.

通过向ion-nav添加参考变量，可以使用@ViewChild来获取Nav组件的实例，该组件是导航控制器(它扩展了NavController)

By adding a reference variable to the ion-nav, you can use @ViewChild to get an instance of the Nav component, which is a navigation controller (it extends NavController)

这篇关于离子2:例外:没有NavController的提供程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

1403页，肝出来的..

navController