fix(angular1_router): rename $route service to $rootRouter

The singleton service that represents the top level router was called
`$router` but this is confusing since there are actually lots of routers,
which depend upon where you are in the DOM. This is similar to the situation
with scopes.

This commit clarifies this singleton by renaming it to `$rootRouter`.

BREAKING CHANGE:

The `$router` injectable service has been renamed to `$rootRouter`

Author: petebacondarwin

modules/angular1_router/index.html

@@ -12,9 +12,9 @@
 <script src="../../dist/angular_1_router.js"></script>
 <script>
   angular.module('myApp', ['ngComponentRouter'])
-    .controller('MyCtrl', ['$router', function ($router) {
-      console.log($router);
-      $router.navigateByUrl('/')
+    .controller('MyCtrl', ['$rootRouter', function ($rootRouter) {
+      console.log($rootRouter);
+      $rootRouter.navigateByUrl('/')
         .then(console.log.bind(console, 'resolve'), console.log.bind(console, 'reject'));
     }]);
 </script>

modules/angular1_router/src/module_template.js

@@ -4,7 +4,7 @@ angular.module('ngComponentRouter').
     // Because Angular 1 has no notion of a root component, we use an object with unique identity
     // to represent this. Can be overloaded with a component name
     value('$routerRootComponent', new Object()).
-    factory('$router', ['$q', '$location', '$$directiveIntrospector', '$browser', '$rootScope', '$injector', '$routerRootComponent', routerFactory]);
+    factory('$rootRouter', ['$q', '$location', '$$directiveIntrospector', '$browser', '$rootScope', '$injector', '$routerRootComponent', routerFactory]);
 
 function routerFactory($q, $location, $$directiveIntrospector, $browser, $rootScope, $injector, $routerRootComponent) {
 

modules/angular1_router/src/ng_outlet.ts

@@ -61,8 +61,8 @@ class DirectiveIntrospectorProvider {
  *
  * The value for the `ngOutlet` attribute is optional.
  */
-function ngOutletDirective($animate, $q: ng.IQService, $router) {
-  let rootRouter = $router;
+function ngOutletDirective($animate, $q: ng.IQService, $rootRouter) {
+  let rootRouter = $rootRouter;
 
   return {
     restrict: 'AE',
@@ -231,8 +231,8 @@ function routerTriggerDirective($q) {
  *
  * ```js
  * angular.module('myApp', ['ngComponentRouter'])
- *   .controller('AppController', ['$router', function($router) {
- *     $router.config({ path: '/user/:id', component: 'user' });
+ *   .controller('AppController', ['$rootRouter', function($rootRouter) {
+ *     $rootRouter.config({ path: '/user/:id', component: 'user' });
  *     this.user = { name: 'Brian', id: 123 };
  *   });
  * ```
@@ -243,13 +243,11 @@ function routerTriggerDirective($q) {
  * </div>
  * ```
  */
-function ngLinkDirective($router, $parse) {
-  let rootRouter = $router;
-
+function ngLinkDirective($rootRouter, $parse) {
   return {require: '?^^ngOutlet', restrict: 'A', link: ngLinkDirectiveLinkFn};
 
   function ngLinkDirectiveLinkFn(scope, element, attrs, ctrl) {
-    let router = (ctrl && ctrl.$$router) || rootRouter;
+    let router = (ctrl && ctrl.$$router) || $rootRouter;
     if (!router) {
       return;
     }
@@ -277,7 +275,7 @@ function ngLinkDirective($router, $parse) {
         return;
       }
 
-      $router.navigateByInstruction(instruction);
+      $rootRouter.navigateByInstruction(instruction);
       event.preventDefault();
     });
   }
@@ -291,9 +289,9 @@ function dashCase(str: string): string {
  * A module for adding new a routing system Angular 1.
  */
 angular.module('ngComponentRouter', [])
-    .directive('ngOutlet', ['$animate', '$q', '$router', ngOutletDirective])
+    .directive('ngOutlet', ['$animate', '$q', '$rootRouter', ngOutletDirective])
     .directive('ngOutlet', ['$compile', ngOutletFillContentDirective])
-    .directive('ngLink', ['$router', '$parse', ngLinkDirective])
+    .directive('ngLink', ['$rootRouter', '$parse', ngLinkDirective])
     .directive('$router', ['$q', routerTriggerDirective]);
 
 /*

modules/angular1_router/src/ng_route_shim.js

@@ -24,12 +24,12 @@
     .directive('a', anchorLinkDirective)
 
     // Connects the legacy $routeProvider config shim to Component Router's config.
-    .run(['$route', '$router', function ($route, $router) {
+    .run(['$route', '$rootRouter', function ($route, $rootRouter) {
       $route.$$subscribe(function (routeDefinition) {
         if (!angular.isArray(routeDefinition)) {
           routeDefinition = [routeDefinition];
         }
-        $router.config(routeDefinition);
+        $rootRouter.config(routeDefinition);
       });
     }]);
 
@@ -241,12 +241,12 @@
 
   }
 
-  function $routeParamsFactory($router, $rootScope) {
+  function $routeParamsFactory($rootRouter, $rootScope) {
     // the identity of this object cannot change
     var paramsObj = {};
 
     $rootScope.$on('$routeChangeSuccess', function () {
-      var newParams = $router._currentInstruction && $router._currentInstruction.component.params;
+      var newParams = $rootRouter._currentInstruction && $rootRouter._currentInstruction.component.params;
 
       angular.forEach(paramsObj, function (val, name) {
         delete paramsObj[name];
@@ -262,7 +262,7 @@
   /**
    * Allows normal anchor links to kick off routing.
    */
-  function anchorLinkDirective($router) {
+  function anchorLinkDirective($rootRouter) {
     return {
       restrict: 'E',
       link: function (scope, element) {
@@ -281,8 +281,8 @@
           }
 
           var href = element.attr(hrefAttrName);
-          if (href && $router.recognize(href)) {
-            $router.navigateByUrl(href);
+          if (href && $rootRouter.recognize(href)) {
+            $rootRouter.navigateByUrl(href);
             event.preventDefault();
           }
         });

modules/angular1_router/test/integration/animation_spec.js

@@ -5,7 +5,7 @@ describe('ngOutlet animations', function () {
     $animate,
     $compile,
     $rootScope,
-    $router,
+    $rootRouter,
     $compileProvider;
 
   beforeEach(function () {
@@ -17,11 +17,11 @@ describe('ngOutlet animations', function () {
       $compileProvider = _$compileProvider_;
     });
 
-    inject(function (_$animate_, _$compile_, _$rootScope_, _$router_) {
+    inject(function (_$animate_, _$compile_, _$rootScope_, _$rootRouter_) {
       $animate = _$animate_;
       $compile = _$compile_;
       $rootScope = _$rootScope_;
-      $router = _$router_;
+      $rootRouter = _$rootRouter_;
     });
 
     registerComponent('userCmp', {
@@ -41,11 +41,11 @@ describe('ngOutlet animations', function () {
 
     compile('<div ng-outlet></div>');
 
-    $router.config([
+    $rootRouter.config([
       { path: '/user/:name', component: 'userCmp' }
     ]);
 
-    $router.navigateByUrl('/user/brian');
+    $rootRouter.navigateByUrl('/user/brian');
     $rootScope.$digest();
     expect(elt.text()).toBe('hello brian');
 
@@ -54,7 +54,7 @@ describe('ngOutlet animations', function () {
     expect(item.event).toBe('enter');
 
     // navigate to pete
-    $router.navigateByUrl('/user/pete');
+    $rootRouter.navigateByUrl('/user/pete');
     $rootScope.$digest();
     expect(elt.text()).toBe('hello pete');