Ionic2的NavController

NavController是导航控制器组件（如Nav/Tab）的基础类class，在你的app中你使用导航控制器跳转到某个页面。在基础层面上看，一个导航控制器就是一个页面数组，其代表着一个特殊历史记录，这个数组通过在历史记录中进行增删实现页面跳转。

你可以认为当前页面是数组中最后一个元素，或者说是栈的的顶部。在导航栈的顶部塞入一个新页面就会触发一个新页面的动画加载。当然如果删除当前页面就在这个栈中暴露出上一个页面。

除非你正在使用一个指令比如NavPush,或者需要一个定义好的NavController，大多数情况，你都是注入以及使用一个参数到最近的NavController中来控制我们的导航栈。

基础应用

最简单的使用方法就是使用<ion-nav>这个组件创建和初始化一个新的nav controller。ion-nav 扩展NavController类。

import { Component } from `@angular/core`;
import { StartPage } from './start-page';

@Component(
  template: `<ion-nav [root]="rootPage"></ion-nav>`
})
class MyApp {
  // set the rootPage to the first page we want displayed
  public rootPage: any = StartPage;

  constructor(){
  }
}

从Root component里导航

如果你希望从你的root app component里控制导航该怎么办？你是不可以直接注入NavController因为任何component都是navigation controllers，都是root component的子组件。

我们可以往ion-nav标签里添加参数变量，你可以使用@ViewChild获取Nav component的一个实例。这个实例就是一个导航控制器:

import { Component, ViewChild } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({
   template: '<ion-nav #myNav [root]="rootPage"></ion-nav>'
})
export class MyApp {
   @ViewChild('myNav') nav: NavController
   public rootPage = TabsPage;

   // Wait for the components in MyApp's template to be initialized
   // In this case, we are waiting for the Nav with reference variable of "#myNav"
   ngOnInit() {
      // Let's navigate from TabsPage to Page1
      this.nav.push(Page1);
   }
}

从一个Overlay Component 中进行导航

比如弹出框，悬浮框这些。