Routing

ionic/components/nav/test/basic/index.js

@@ -1,15 +1,19 @@
-import {bootstrap} from 'angular2/angular2'
+import {bootstrap, onInit, QueryList} from 'angular2/angular2'
 import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations';
 import {View} from 'angular2/src/core/annotations_impl/view';
 
+
 import {Nav} from 'ionic/components/nav/nav';
 import {FirstPage} from './pages/first-page';
+import {Router} from 'ionic/routing/router';
 
 
-@Component({ selector: 'ion-app' })
+@Component({
+  selector: 'ion-app',
+})
 @View({
   template: `
-    <ion-nav [initial]="initial"></ion-nav>
+    <ion-nav #nav [initial]="initial"></ion-nav>
   `,
   directives: [Nav]
 })

ionic/components/nav/test/basic/pages/first-page.js

@@ -2,6 +2,7 @@ import {Component, Directive, onInit} from 'angular2/src/core/annotations_impl/a
 import {View} from 'angular2/src/core/annotations_impl/view';
 
 import {Routable, Router, NavController, NavbarTemplate, Navbar, NavPush, Content} from 'ionic/ionic';
+import {IonicApp} from '../index';
 import {SecondPage} from './second-page';
 
 @Component({
@@ -34,6 +35,10 @@ export class FirstPage {
   constructor(
     nav: NavController
   ) {
+
+    // TODO: Shouldn't have to do this
+    Router.setNavController(nav);
+
     this.nav = nav;
     this.val = Math.round(Math.random() * 8999) + 1000;
 

ionic/components/nav/test/basic/pages/second-page.js

@@ -32,6 +32,9 @@ export class SecondPage {
     nav: NavController,
     params: NavParams
   ) {
+    // TODO: Shouldn't have to do this
+    Router.setNavController(nav);
+
     this.nav = nav;
     this.params = params;
     this.val = Math.round(Math.random() * 8999) + 1000;

ionic/routing/router.js

@@ -23,16 +23,63 @@ export class RouterController {
     return {}
   }
 
+  setNavController(navController) {
+    this.rootNavController = navController;
+    console.log('Root nav controller set', navController);
+    this.run();
+  }
+
+  getCurrentPath() {
+    let hash = window.location.hash;
+
+    // Grab the path without the leading hash
+    let path = hash.slice(1);
+    return path;
+  }
+
+  push(componentClass, params) {
+    if(!this.rootNavController) {
+      console.error('Router: No root nav controller to push matching route.');
+      return;
+    }
+    console.log('Router pushing', componentClass, params);
+    setTimeout(() => {
+      this.rootNavController.push(componentClass, params);
+    });
+  }
+
+  run() {
+    this.match();
+  }
+
+  /**
+   * Try to match a single route.
+   */
+  matchOne(route) {
+    console.log('Match one', route);
+    let path = this.getCurrentPath();
+    let routeParams = route.match(path);
+
+    if(routeParams !== false) {
+      route.exec(this._buildRouteParams(routeParams));
+
+      // If the route has a registered URL and isn't set to quiet mode,
+      // emit the new URL into the address bar
+      if(route.url && !route.quiet) {
+        this.emit(route.url);
+      }
+
+      return
+    }
+  }
+
   /**
    * Check the current hash/location for a match with
    * registered routes. If a match is found, execute the
    * first one and then return.
    */
   match() {
-    let hash = window.location.hash;
+    let path = this.getCurrentPath();
-
-    // Grab the path without the leading hash
-    let path = hash.slice(1);
 
     let routeParams = {};
 
@@ -43,11 +90,13 @@ export class RouterController {
       if(routeParams !== false) {
         route.exec(this._buildRouteParams(routeParams));
 
+        /*
         // If the route has a registered URL and isn't set to quiet mode,
         // emit the new URL into the address bar
         if(route.url && !route.quiet) {
           this.emit(route.url);
         }
+        */
 
         return
       }
@@ -73,7 +122,7 @@ export class RouterController {
   on(path, cb) {
     let route = new Route(path, cb);
     this.routes.push(route);
-    this.match();
+    //this.matchOne(route);
     return route;
   }
 
@@ -160,11 +209,16 @@ export class Routable {
     this.routeInfo = routeInfo;
 
     //console.log('New routable', componentClass, routeInfo);
+    Router.on(this.routeInfo.url, (routeParams) => {
+      console.log('Routable matched', routeParams, this.componentClass);
+      Router.push(this.componentClass, routeParams);
+    });
 
     componentClass.router = this;
   }
   invoke(componentInstance) {
     // Called on viewLoaded
+    this.componentInstance = componentInstance;
 
     // Bind some lifecycle events
     componentInstance._viewWillEnter.observer({