angular - 没有 NavController 的提供者

标签 angular navigation ionic2

我从侧边菜单启动器启动了一个 ionic 2 应用程序。现在我想将生成的代码移动到应用程序组件(菜单)到一个文件夹中,然后编写一个主组件。当我运行该应用程序时,它向我显示此错误:

原始异常(exception):没有 NavController 的提供者!

我的 app.component 的代码是:

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

我想重定向到我的菜单 (sidemenu) 页面:

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

最佳答案

强制那个东西以下一种方式工作

  constructor(
    protected app: App
  ) {

...

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

关于angular - 没有 NavController 的提供者,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40131832/

相关文章:

html - 随缩放移动的导航栏未对齐 [HTML/CSS]

javascript - 未设置子组件中输入属性的 Angular 异步管道

Angular 库 - 'rootDir' 预计包含所有源文件。 (环境.ts)

angular - tslint 不排除 Angular 项目中的 node_modules

html - 具有灵活左右宽度的居中导航 - 百分比填充不起作用

CSS 导航栏在 IE 和 FF 中没有正确排列

ionic-framework - Ionic 2 Beta 和 Open Layers 3 未加载 map

angular - 你能在 Angular 2(使用 Typescript)中返回一个 observable 作为 promise 吗?

ionic-framework - IONIC 应用程序启动画面后出现白屏

Angular 2如何让setter等待输入setter完成