diff --git a/src/navigation/nav-controller.ts b/src/navigation/nav-controller.ts
index 1c358a2add..ff7f76d4a4 100644
--- a/src/navigation/nav-controller.ts
+++ b/src/navigation/nav-controller.ts
@@ -18,7 +18,7 @@ import { ViewController } from './view-controller';
* arbitrary locations in history.
*
* The current page is the last one in the array, or the top of the stack if we
- * think of it that way. [Pushing](#push) a new page onto the top of the
+ * think of it that way. [Pushing](#push) a new page onto the top of the
* navigation stack causes the new page to be animated in, while [popping](#pop)
* the current page will navigate to the previous page in the stack.
*
@@ -33,7 +33,6 @@ import { ViewController } from './view-controller';
*
* ```typescript
* import { Component } from `@angular/core`;
- * import { ionicBootstrap } from 'ionic-angular';
* import { StartPage } from './start-page';
*
* @Component(
@@ -41,13 +40,12 @@ import { ViewController } from './view-controller';
* })
* class MyApp {
* // set the rootPage to the first page we want displayed
- * private rootPage: any = StartPage;
+ * public rootPage: any = StartPage;
*
* constructor(){
* }
* }
*
- * ionicBootstrap(MyApp);
* ```
*
* ### Injecting NavController
@@ -85,25 +83,57 @@ import { ViewController } from './view-controller';
*
* ```typescript
*
- * import { App, ViewChild } from '@angular/core';
+ * import { Component, ViewChild } from '@angular/core';
* import { NavController } from 'ionic-angular';
*
- * @App({
+ * @Component({
* template: ''
* })
* export class MyApp {
* @ViewChild('myNav') nav: NavController
- * private rootPage = TabsPage;
+ * public rootPage = TabsPage;
*
* // Wait for the components in MyApp's template to be initialized
- * // In this case, we are waiting for the Nav with id="my-nav"
- * ngAfterViewInit() {
+ * // 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);
* }
* }
* ```
*
+ * ### Navigating from an Overlay Component
+ * What if you wanted to navigate from an overlay component (popover, modal, alert, etc)?
+ * In this example, we've displayed a popover in our app. From the popover, we'll get a
+ * reference of the root `NavController` in our app, using the `getRootNav()` method.
+ *
+ *
+ * ```typescript
+ * import { Component } from '@angular/core';
+ * import { App, ViewController } from 'ionic-angular';
+ *
+ * @Component({
+ * template: `
+ *
+ *
My PopoverPage
+ *
+ *
+ * `
+ * })
+ * class PopoverPage {
+ * constructor(
+ * public viewCtrl: ViewController
+ * public appCtrl: App
+ * ) {}
+ *
+ * pushPage() {
+ * this.viewCtrl.dismiss();
+ * this.appCtrl.getRootNav().push(SecondPage);
+ * }
+ * }
+ *```
+ *
+ *
* ## View creation
* Views are created when they are added to the navigation stack. For methods
* like [push()](#push), the NavController takes any component class that is
@@ -195,7 +225,7 @@ import { ViewController } from './view-controller';
* I'm the other page!`
* })
* class OtherPage {
- * constructor(private navCtrl: NavController ){
+ * constructor(public navCtrl: NavController ){
* }
*
* popView(){