Question

我是离子新手，我想了解下面的代码。我无法理解＆＃34; NAV＆＃34;为什么我们在@viewchild（）中使用那个NAV。我可以在构造函数中使用它来访问MenuController，为什么不能在构造函数中使用该NAV。

＆＃13;

import { Component, ViewChild } from '@angular/core';

import { Platform, MenuController, Nav } from 'ionic-angular';

import { HelloIonicPage } from '../pages/hello-ionic/hello-ionic';
import { ListPage } from '../pages/list/list';

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';


@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  @ViewChild(Nav) nav: Nav;

  // make HelloIonicPage the root (or first) page
  rootPage = HelloIonicPage;
  pages: Array<{title: string, component: any}>;

  constructor(
    public platform: Platform,
    public menu: MenuController,
    public statusBar: StatusBar,
    public splashScreen: SplashScreen
  ) {
    this.initializeApp();

    // set our app's pages
    this.pages = [
      { title: 'Hello Ionic', component: HelloIonicPage },
      { title: 'My First List', component: ListPage }
    ];
  }

  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.
      this.statusBar.styleDefault();
      this.splashScreen.hide();
    });
  }

  openPage(page) {
    // close the menu when clicking a link from the menu
    this.menu.close();
    // navigate to the new page if it is not the current page
    this.nav.setRoot(page.component);
  }
}

＆＃13;

Answer 1

因为任何作为导航控制器的组件都是根组件的子组件，所以它们不能被注入。

通过向ion-nav添加引用变量，您可以使用@ViewChild获取Nav组件的实例，该组件是导航控制器（它扩展为NavController ）

<强>更新：

当我们想要访问子组件并调用方法或访问子级上可用的实例变量时，我们使用@ViewChild。 NavController是导航控制器组件的基类，例如Nav和Tab，因此您可以通过构造函数访问它，但Nav extends NavController（它的子句NavController {1}}）因此您无法直接访问构造函数，然后@ViewChild可以访问它。

Answer 2

可以找到答案here (v3)

从“根”组件导航

如果您想控制怎么办   您的根应用程序组件导航？你不能注入   NavController，因为任何组件都是导航控制器   是根组件的子代，因此无法使用它们   注射。

通过在ion-nav中添加参考变量，可以使用@ViewChild   获取Nav组件的实例，该实例是一个导航   控制器（它扩展了NavController）：

为什么我们无法在构造函数中使用Nav而不是@ViewChild（Nav）nav：在离子导航中

2 个答案: