Question

这是什么意思？

如果您想要从根应用程序组件（使用@App，而不是@Page装饰的那个）控制导航，该怎么办？您无法注入NavController ，因为任何作为导航控制器的组件都是根组件的子组件，因此无法注入它们。

通过向ion-nav添加id，您可以使用IonicApp服务获取对Nav组件的引用，Nav组件是一个导航控制器（它扩展了NavController）：

Answer 1

以防万一，这可以帮助其他开发人员，以及Ionic2 beta 8

@App和@Page应该替换为@Component。

现在，您应该可以通过执行以下操作从根组件导航：

import {Component, ViewChild, provide, PLATFORM_DIRECTIVES} from '@angular/core';
import {ionicBootstrap, App, Platform, MenuController, Nav} from 'ionic-angular';
import {StatusBar} from 'ionic-native';
import {HomePage} from './pages/home/home';

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

  rootPage: any = HomePage;

  constructor(private platform: Platform, private menu: MenuController) {
    this.initializeApp();
  }

  initializeApp(): void {
    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(aPage: any) {
    // 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(aPage);
  }
}

ionicBootstrap(MyApp, [], {
  //config options
});

Answer 2

请记住，页面和组件不是一回事。

您的页面全部导入NavController，因此无需破解DOM！ :)您当前页面能够推送任何其他页面，只要您导入该页面（当前页面需要知道要推送的页面的存在）。

this.nav.push(OtherPage);

同样，当前页面可以从视图中弹出。

this.nav.pop();

它甚至可以直接更改根视图。

this.nav.setRoot(OtherPage);

最后，这个Simple guide to navigation in ionic2会很好地解释这一切......

Answer 3

要从根组件导航，首先必须获取组件然后再次设置它，请参阅下面的示例：

this.app.getRootNav（）。setRoot（VisitorsPage）;

离子2：从根组件导航

3 个答案: