diff --git a/ionic/components.js b/ionic/components.js
index 0c7e6a98b9..d11d62b1e6 100644
--- a/ionic/components.js
+++ b/ionic/components.js
@@ -13,6 +13,7 @@ export * from 'ionic/components/form/label/label'
 // export * from 'ionic/components/layout/layout'
 export * from 'ionic/components/list/list'
 export * from 'ionic/components/nav/nav'
+export * from 'ionic/components/nav/nav-controller'
 export * from 'ionic/components/nav/nav-item'
 // export * from 'ionic/components/nav/decorators'
 export * from 'ionic/components/radio/radio'
diff --git a/ionic/components/nav/nav-base.js b/ionic/components/nav/nav-base.js
index 20628f24f2..d6e3911431 100644
--- a/ionic/components/nav/nav-base.js
+++ b/ionic/components/nav/nav-base.js
@@ -1,6 +1,7 @@
 import * as util from 'ionic/util';
 import {Transition, ClickBlock} from 'ionic/ionic';
-import {NavItem} from './nav-item'
+import {NavItem} from './nav-item';
+import {NavController} from './nav-controller';
 
 
 const STAGED_STATE = 'staged';
@@ -16,6 +17,7 @@ export class NavBase {
 
   constructor() {
     this.items = [];
+    this.navCtrl = new NavController(this);
   }
 
   set initial(Class) {
diff --git a/ionic/components/nav/nav-controller.js b/ionic/components/nav/nav-controller.js
index 8701452d9c..cc52653644 100644
--- a/ionic/components/nav/nav-controller.js
+++ b/ionic/components/nav/nav-controller.js
@@ -1,13 +1,15 @@
 
 export class NavController {
-  constructor() {
+
+  constructor(nav) {
+    this._nav = nav;
   }
 
   push() {
-    return this.nav.push.apply(this.nav, arguments);
+    return this._nav.push.apply(this._nav, arguments);
   }
 
   pop() {
-    return this.nav.pop.apply(this.nav, arguments);
+    return this._nav.pop.apply(this._nav, arguments);
   }
 }
diff --git a/ionic/components/nav/nav-item.js b/ionic/components/nav/nav-item.js
index f263c3cba5..17e2bb726a 100644
--- a/ionic/components/nav/nav-item.js
+++ b/ionic/components/nav/nav-item.js
@@ -1,6 +1,8 @@
 import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
+import {bind} from 'angular2/di';
 
 import * as util from 'ionic/util';
+import {NavController} from './nav-controller';
 
 
 export class NavItem {
@@ -16,14 +18,16 @@ export class NavItem {
     let resolve;
     let promise = new Promise((res) => { resolve = res; });
 
-    let injector = null;
-
+    let injector = this.nav.injector.resolveAndCreateChild([
+      bind(NavController).toValue(this.nav.navCtrl)
+    ]);
 
     this.nav.loader.loadNextToExistingLocation(this.Class, this.nav.itemContent.elementRef, injector)
                    .then((componentRef) => {
 
       this.component = componentRef;
       this.domElement = componentRef.location.domElement;
+      this.domElement.classList.add('nav-item');
 
       resolve();
     });
diff --git a/ionic/components/nav/nav.js b/ionic/components/nav/nav.js
index 1604e8a4e0..ff5b9d97ba 100644
--- a/ionic/components/nav/nav.js
+++ b/ionic/components/nav/nav.js
@@ -3,6 +3,7 @@ import {Component, Directive} from 'angular2/src/core/annotations_impl/annotatio
 import {View} from 'angular2/src/core/annotations_impl/view';
 import {DynamicComponentLoader} from 'angular2/src/core/compiler/dynamic_component_loader';
 import {ElementRef} from 'angular2/src/core/compiler/element_ref';
+import {Injector} from 'angular2/di';
 
 import {NavBase} from 'ionic/components/nav/nav-base';
 import {NavItem, NavItemDynamicComponent} from 'ionic/components/nav/nav-item';
@@ -33,12 +34,14 @@ export class Nav extends NavBase {
 
   constructor(
     loader: DynamicComponentLoader,
-    elementRef: ElementRef
+    elementRef: ElementRef,
+    injector: Injector
   ) {
     super();
     this.loader = loader;
     this.viewManager = loader._viewManager;
     this.elementRef = elementRef;
+    this.injector = injector;
   }
 
 }
diff --git a/ionic/components/nav/test/basic/pages/first-page.js b/ionic/components/nav/test/basic/pages/first-page.js
index be9c827a56..2abfd6d32a 100644
--- a/ionic/components/nav/test/basic/pages/first-page.js
+++ b/ionic/components/nav/test/basic/pages/first-page.js
@@ -5,15 +5,15 @@ import {NavController} from 'ionic/ionic'
 import {SecondPage} from './second-page'
 
 
-@Component()
+@Component({selector: 'ion-view'})
 @View({
   templateUrl: 'pages/first-page.html'
 })
 export class FirstPage {
   constructor(
-    //nav: NavController
+    nav: NavController
   ) {
-    //this.nav = nav;
+    this.nav = nav;
   }
 
   push() {
diff --git a/ionic/transitions/ios-transition.js b/ionic/transitions/ios-transition.js
index 6f433cdf64..fb4b8761c5 100644
--- a/ionic/transitions/ios-transition.js
+++ b/ionic/transitions/ios-transition.js
@@ -28,11 +28,11 @@ class IOSTransition extends Animation {
     this.leavingItem = navCtrl.getStagedLeavingItem();
 
     // create animation for the entering item
-    let enteringItemAnimation = new Animation(this.enteringItem.navItem.domElement);
+    let enteringItemAnimation = new Animation(this.enteringItem.domElement);
 
     // create animation for the leaving item
     // leavingItem could be null, but the animation instance knows to do nothing
-    let leavingItemAnimation = new Animation(this.leavingItem && this.leavingItem.navItem.domElement);
+    let leavingItemAnimation = new Animation(this.leavingItem && this.leavingItem.domElement);
 
     // entering item moves to center
     // before starting, set enteringItem to display: block