Question

我最近从Ionic 2升级到Ionic 3.升级后，我在根页面中将Nav视为未定义。

//app.component.ts
import { Component, ViewChild, Renderer } from '@angular/core';
import { Platform, Nav, MenuController } from 'ionic-angular';
@Component({
  templateUrl: `app.html`
})
export class MyApp {



@ViewChild(Nav) nav : NavController ;
  rootPage: any;
  authHandler : any;
  pages: Array<{title: string, component: any, icon: string}>;
  urls: Array<{title: string, url: string, icon: string}>;
  contact: Array<{title: string, url: string, icon: string}>;

  constructor(public platform: Platform,
              public renderer : Renderer,
              public menu: MenuController,
              public loginService : LoginService,
              public util : UtilityService,
              public statusBar: StatusBar,
              public keyboard: Keyboard) {
    this.initializeApp();
    console.log("THis is nav object :: ", this.nav);
}

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

在控制台中输出：

THis is nav object ::  undefined

Ionic 3中的内容是否发生了变化我必须做些什么？为了做到这一点？

Answer 1

您必须使用离子导航模板

@Component({
   template: '<ion-nav #myNav [root]="rootPage"></ion-nav>'
})

喜欢在这里描述：https://ionicframework.com/docs/api/navigation/NavController/#navigating-from-the-root-component

或者您可以在app.html中添加ion-nav标签：

<ion-nav id="nav" [root]="rootPage" #content swipe-back-enabled="false"></ion-nav>

在根页面中将Nav视为未定义

1 个答案: