refactor(routing): Make use of the latest API for docs & tests

Closes #799

Author: vicb

lib/routing/module.dart

@@ -24,7 +24,6 @@
  *   * `/recipe/:recipeId/view`
  *   * `/recipe/:recipeId/edit`
  *
- *
  * Let's try to define those routes in Angular. To get started we need to
  * provide an implementation of [RouteInitializerFn] function.
  *
@@ -37,29 +36,18 @@
  *
  *  Let's see how we could define our routes using the routing framework:
  *
- *      void initRoutes(Router router, RouteViewFactory view) {
- *        router.root
- *            ..addRoute(
- *                name: 'recipes',
- *                path: '/recipes',
- *                enter: view('recipes.html'))
- *            ..addRoute(
- *                name: 'addRecipe',
- *                path: '/addRecipe',
- *                enter: view('addRecipe.html'))
- *            ..addRoute(
- *                name: 'viewRecipe',
- *                path: '/recipe/:recipeId/view',
- *                enter: view('viewRecipe.html'))
- *            ..addRoute(
- *                name: 'editRecipe',
- *                path: '/recipe/:recipeId/edit',
- *                enter: view('editRecipe.html'));
+ *      void initRoutes(Router router, RouteViewFactory views) {
+ *        views.configure({
+ *            'recipes': ngRoute(path: '/recipes', view: 'recipes.html'),
+ *            'addRecipe': ngRoute(path: '/addRecipe', view: 'addRecipe.html'),
+ *            'viewRecipe': ngRoute(path: '/recipe/:recipeId/view', view: 'viewRecipe.html'),
+ *            'editRecipe': ngRoute(path: '/recipe/:recipeId/edit', view: 'editRecipe.html)
+ *        });
  *      }
  *
  *  We defined 4 routes and for each route we set views (templates) to be
  *  displayed when that route is "entered". For example, when the browser URL
- *  is set to `/recipes`, the `recipes.html` will be displayed.
+ *  is set to `/recipes`, the `recipes.html` template will be displayed.
  *
  *  You have to tell Angular where to load views by putting `<ng-view>` tag in
  *  you template.
@@ -112,41 +100,25 @@
  *  [RouteEvent.allowLeave].
  *
  *  Notice that we create a [RouteHandle] for our route. [RouteHandle] are
- *  a convinient wrapper around [Route] that makes unsubscribing route events
+ *  a convenient wrapper around [Route] that makes unsubscribing route events
  *  easier. For example, notice that we didn't need to manually call
  *  [StreamSubscription.cancel] for subscription to [Route.onLeave]. Calling
- *  [RouteHandle.discard] unsubscribes all listeneters created for the handle.
- *
+ *  [RouteHandle.discard] unsubscribes all listeners created for the handle.
  *
  * ## Hierarchical Routes
  *
  *  The routing framework allows us to define trees of routes. In our recipes
  *  example we could have defined our routes like this:
  *
  *     void initRoutes(Router router, RouteViewFactory view) {
- *       router.root
- *           ..addRoute(
- *              name: 'recipes',
- *              path: '/recipes',
- *              enter: view('recipes.html'))
- *           ..addRoute(
- *              name: 'addRecipe',
- *              path: '/addRecipe',
- *              enter: view('addRecipe.html'))
- *           ..addRoute(
- *              name: 'recipe',
- *              path: '/recipe/:recipeId',
- *              mount: (Route route) => route
- *                  ..addRoute(
- *                      name: 'view',
- *                      path: '/view',
- *                      enter: view('viewRecipe.html'))
- *                  ..addRoute(
- *                      name: 'edit',
- *                      path: '/edit',
- *                      enter: view('editRecipe.html')));
- *     }
- *
+ *        views.configure({
+ *            'recipes': ngRoute(path: '/recipes', view: 'recipes.html'),
+ *            'addRecipe': ngRoute(path: '/addRecipe', view: 'addRecipe.html'),
+ *            'recipe': ngRoute(path: '/recipe/:recipeId', mount: {
+ *                'view': ngRoute(path: '/view', view: 'viewRecipe.html'),
+ *                'edit': ngRoute(path: '/edit', view: 'editRecipe.html),
+ *            })
+ *        });
  */
 library angular.routing;
 

lib/routing/ng_view.dart

@@ -9,32 +9,28 @@ part of angular.routing;
  * [NgViewDirective] can work with [NgViewDirective] to define nested views
  * for hierarchical routes. For example:
  *
- *     void initRoutes(Router router, RouteViewFactory view) {
- *       router.root
- *         ..addRoute(
- *             name: 'library',
- *             path: '/library',
- *             enter: view('library.html'),
- *             mount: (Route route) => route
- *               ..addRoute(
- *                   name: 'all',
- *                   path: '/all',
- *                   enter: view('book_list.html'))
- *               ..addRoute(
- *                   name: 'book',
- *                   path: '/:bookId',
- *                   mount: (Route route) => route
- *                     ..addRoute(
- *                         name: 'overview',
- *                         path: '/overview',
- *                         defaultRoute: true,
- *                         enter: view('book_overview.html'))
- *                     ..addRoute(
- *                         name: 'read',
- *                         path: '/read',
- *                         enter: view('book_read.html'))));
- *     }
- *   }
+ *     void initRoutes(Router router, RouteViewFactory views) {
+ *       views.configure({
+ *          'library': ngRoute(
+ *              path: '/library',
+ *              view: 'library.html',
+ *              mount: {
+ *                  'all': ngRoute(
+ *                      path: '/all',
+ *                      view: 'book_list.html'),
+ *                   'book': ngRoute(
+ *                      path: '/:bookId',
+ *                      mount: {
+ *                          'overview': ngRoute(
+ *                              path: '/overview',
+ *                              defaultRoute: true,
+ *                              view: 'book_overview.html'),
+ *                          'read': ngRoute(
+ *                              path: '/read',
+ *                              view: 'book_read.html'),
+ *                      })
+ *              })
+ *       });
  *
  * index.html:
  *

test/routing/ng_bind_route_spec.dart

@@ -53,33 +53,20 @@ main() {
 }
 
 class NestedRouteInitializer implements Function {
-  void call(Router router, RouteViewFactory view) {
-    router.root
-      ..addRoute(
-          name: 'library',
-          path: '/library',
-          enter: view('library.html'),
-          mount: (Route route) => route
-            ..addRoute(
-                name: 'all',
-                path: '/all',
-                enter: view('book_list.html'))
-            ..addRoute(
-                name: 'book',
-                path: '/:bookId',
-                mount: (Route route) => route
-                  ..addRoute(
-                      name: 'overview',
-                      path: '/overview',
-                      defaultRoute: true,
-                      enter: view('book_overview.html'))
-                  ..addRoute(
-                      name: 'read',
-                      path: '/read',
-                      enter: view('book_read.html'))))
-                  ..addRoute(
-                      name: 'admin',
-                      path: '/admin',
-                      enter: view('admin.html'));
+  void call(Router router, RouteViewFactory views) {
+    views.configure({
+        'library': ngRoute(
+            path: '/library',
+            view: 'library.html',
+            mount: {
+                'all': ngRoute(path: '/all', view: 'book_list.html'),
+                'book': ngRoute(path: '/bookId', mount: {
+                    'overview': ngRoute(path: '/overview', defaultRoute: true,
+                                        view: 'book_overview.html'),
+                    'read': ngRoute(path: '/read', view: 'book_read.html'),
+                    'admin': ngRoute(path: '/admin', view: 'admin.html'),
+              })
+            })
+    });
   }
 }