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`
This commit is contained in:
Peter Bacon Darwin
2016-02-17 07:47:49 +00:00
committed by Pete Bacon Darwin
parent edad8e3f56
commit a1c3be21ec
11 changed files with 141 additions and 143 deletions

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@ -4,7 +4,7 @@ describe('Navigation lifecycle', function () {
var elt, var elt,
$compile, $compile,
$rootScope, $rootScope,
$router, $rootRouter,
$compileProvider; $compileProvider;
beforeEach(function () { beforeEach(function () {
@ -14,10 +14,10 @@ describe('Navigation lifecycle', function () {
$compileProvider = _$compileProvider_; $compileProvider = _$compileProvider_;
}); });
inject(function (_$compile_, _$rootScope_, _$router_) { inject(function (_$compile_, _$rootScope_, _$rootRouter_) {
$compile = _$compile_; $compile = _$compile_;
$rootScope = _$rootScope_; $rootScope = _$rootScope_;
$router = _$router_; $rootRouter = _$rootRouter_;
}); });
registerComponent('oneCmp', { registerComponent('oneCmp', {
@ -38,12 +38,12 @@ describe('Navigation lifecycle', function () {
$routerOnActivate: spy $routerOnActivate: spy
}); });
$router.config([ $rootRouter.config([
{ path: '/a', component: 'activateCmp' } { path: '/a', component: 'activateCmp' }
]); ]);
compile('<div>outer { <div ng-outlet></div> }</div>'); compile('<div>outer { <div ng-outlet></div> }</div>');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
expect(spy).toHaveBeenCalled(); expect(spy).toHaveBeenCalled();
@ -56,12 +56,12 @@ describe('Navigation lifecycle', function () {
$routerOnActivate: spy $routerOnActivate: spy
}); });
$router.config([ $rootRouter.config([
{ path: '/user/:name', component: 'userCmp' } { path: '/user/:name', component: 'userCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/user/brian'); $rootRouter.navigateByUrl('/user/brian');
$rootScope.$digest(); $rootScope.$digest();
expect(spy).toHaveBeenCalledWith(instructionFor('userCmp'), undefined); expect(spy).toHaveBeenCalledWith(instructionFor('userCmp'), undefined);
@ -75,15 +75,15 @@ describe('Navigation lifecycle', function () {
$routerOnActivate: spy $routerOnActivate: spy
}); });
$router.config([ $rootRouter.config([
{ path: '/user/:name', component: 'oneCmp' }, { path: '/user/:name', component: 'oneCmp' },
{ path: '/post/:id', component: 'activateCmp' } { path: '/post/:id', component: 'activateCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/user/brian'); $rootRouter.navigateByUrl('/user/brian');
$rootScope.$digest(); $rootScope.$digest();
$router.navigateByUrl('/post/123'); $rootRouter.navigateByUrl('/post/123');
$rootScope.$digest(); $rootScope.$digest();
expect(spy).toHaveBeenCalledWith(instructionFor('activateCmp'), expect(spy).toHaveBeenCalledWith(instructionFor('activateCmp'),
instructionFor('oneCmp')); instructionFor('oneCmp'));
@ -98,12 +98,12 @@ describe('Navigation lifecycle', function () {
} }
}); });
$router.config([ $rootRouter.config([
{ path: '/user', component: 'userCmp' } { path: '/user', component: 'userCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/user'); $rootRouter.navigateByUrl('/user');
$rootScope.$digest(); $rootScope.$digest();
expect(injectedScope).toBeDefined(); expect(injectedScope).toBeDefined();
@ -116,15 +116,15 @@ describe('Navigation lifecycle', function () {
$routerOnDeactivate: spy $routerOnDeactivate: spy
}); });
$router.config([ $rootRouter.config([
{ path: '/a', component: 'deactivateCmp' }, { path: '/a', component: 'deactivateCmp' },
{ path: '/b', component: 'oneCmp' } { path: '/b', component: 'oneCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
$router.navigateByUrl('/b'); $rootRouter.navigateByUrl('/b');
$rootScope.$digest(); $rootScope.$digest();
expect(spy).toHaveBeenCalled(); expect(spy).toHaveBeenCalled();
}); });
@ -136,15 +136,15 @@ describe('Navigation lifecycle', function () {
$routerOnDeactivate: spy $routerOnDeactivate: spy
}); });
$router.config([ $rootRouter.config([
{ path: '/user/:name', component: 'deactivateCmp' }, { path: '/user/:name', component: 'deactivateCmp' },
{ path: '/post/:id', component: 'oneCmp' } { path: '/post/:id', component: 'oneCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/user/brian'); $rootRouter.navigateByUrl('/user/brian');
$rootScope.$digest(); $rootScope.$digest();
$router.navigateByUrl('/post/123'); $rootRouter.navigateByUrl('/post/123');
$rootScope.$digest(); $rootScope.$digest();
expect(spy).toHaveBeenCalledWith(instructionFor('oneCmp'), expect(spy).toHaveBeenCalledWith(instructionFor('oneCmp'),
instructionFor('deactivateCmp')); instructionFor('deactivateCmp'));
@ -166,15 +166,15 @@ describe('Navigation lifecycle', function () {
} }
}); });
$router.config([ $rootRouter.config([
{ path: '/a', component: 'deactivateCmp' }, { path: '/a', component: 'deactivateCmp' },
{ path: '/b', component: 'activateCmp' } { path: '/b', component: 'activateCmp' }
]); ]);
compile('outer { <div ng-outlet></div> }'); compile('outer { <div ng-outlet></div> }');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
$router.navigateByUrl('/b'); $rootRouter.navigateByUrl('/b');
$rootScope.$digest(); $rootScope.$digest();
expect(log).toEqual(['deactivate', 'activate']); expect(log).toEqual(['deactivate', 'activate']);
@ -203,19 +203,19 @@ describe('Navigation lifecycle', function () {
} }
}); });
$router.config([ $rootRouter.config([
{ path: '/on-reuse/:number/...', component: 'reuseCmp' }, { path: '/on-reuse/:number/...', component: 'reuseCmp' },
{ path: '/two', component: 'twoCmp', name: 'Two'} { path: '/two', component: 'twoCmp', name: 'Two'}
]); ]);
compile('outer { <div ng-outlet></div> }'); compile('outer { <div ng-outlet></div> }');
$router.navigateByUrl('/on-reuse/1/a'); $rootRouter.navigateByUrl('/on-reuse/1/a');
$rootScope.$digest(); $rootScope.$digest();
expect(log).toEqual([]); expect(log).toEqual([]);
expect(cmpInstanceCount).toBe(1); expect(cmpInstanceCount).toBe(1);
expect(elt.text()).toBe('outer { reuse {one} }'); expect(elt.text()).toBe('outer { reuse {one} }');
$router.navigateByUrl('/on-reuse/2/b'); $rootRouter.navigateByUrl('/on-reuse/2/b');
$rootScope.$digest(); $rootScope.$digest();
expect(log).toEqual(['reuse: on-reuse/1 -> on-reuse/2']); expect(log).toEqual(['reuse: on-reuse/1 -> on-reuse/2']);
expect(cmpInstanceCount).toBe(1); expect(cmpInstanceCount).toBe(1);
@ -245,19 +245,19 @@ describe('Navigation lifecycle', function () {
} }
}); });
$router.config([ $rootRouter.config([
{ path: '/never-reuse/:number/...', component: 'reuseCmp' }, { path: '/never-reuse/:number/...', component: 'reuseCmp' },
{ path: '/two', component: 'twoCmp', name: 'Two'} { path: '/two', component: 'twoCmp', name: 'Two'}
]); ]);
compile('outer { <div ng-outlet></div> }'); compile('outer { <div ng-outlet></div> }');
$router.navigateByUrl('/never-reuse/1/a'); $rootRouter.navigateByUrl('/never-reuse/1/a');
$rootScope.$digest(); $rootScope.$digest();
expect(log).toEqual([]); expect(log).toEqual([]);
expect(cmpInstanceCount).toBe(1); expect(cmpInstanceCount).toBe(1);
expect(elt.text()).toBe('outer { reuse {one} }'); expect(elt.text()).toBe('outer { reuse {one} }');
$router.navigateByUrl('/never-reuse/2/b'); $rootRouter.navigateByUrl('/never-reuse/2/b');
$rootScope.$digest(); $rootScope.$digest();
expect(log).toEqual([]); expect(log).toEqual([]);
expect(cmpInstanceCount).toBe(2); expect(cmpInstanceCount).toBe(2);
@ -274,12 +274,12 @@ describe('Navigation lifecycle', function () {
$routerOnActivate: spy $routerOnActivate: spy
}); });
$router.config([ $rootRouter.config([
{ path: '/a', component: 'activateCmp' } { path: '/a', component: 'activateCmp' }
]); ]);
compile('outer { <div ng-outlet></div> }'); compile('outer { <div ng-outlet></div> }');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
expect(spy).not.toHaveBeenCalled(); expect(spy).not.toHaveBeenCalled();
@ -296,12 +296,12 @@ describe('Navigation lifecycle', function () {
$routerOnActivate: activateSpy $routerOnActivate: activateSpy
}); });
$router.config([ $rootRouter.config([
{ path: '/a', component: 'activateCmp' } { path: '/a', component: 'activateCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
expect(canActivateSpy).toHaveBeenCalled(); expect(canActivateSpy).toHaveBeenCalled();
@ -320,12 +320,12 @@ describe('Navigation lifecycle', function () {
$routerOnActivate: spy $routerOnActivate: spy
}); });
$router.config([ $rootRouter.config([
{ path: '/a', component: 'activateCmp' } { path: '/a', component: 'activateCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
expect(spy).toHaveBeenCalled(); expect(spy).toHaveBeenCalled();
@ -341,12 +341,12 @@ describe('Navigation lifecycle', function () {
spy.$inject = ['$nextInstruction', '$http']; spy.$inject = ['$nextInstruction', '$http'];
$router.config([ $rootRouter.config([
{ path: '/user/:name', component: 'activateCmp' } { path: '/user/:name', component: 'activateCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/user/brian'); $rootRouter.navigateByUrl('/user/brian');
$rootScope.$digest(); $rootScope.$digest();
expect(spy).toHaveBeenCalled(); expect(spy).toHaveBeenCalled();
@ -364,17 +364,17 @@ describe('Navigation lifecycle', function () {
} }
}); });
$router.config([ $rootRouter.config([
{ path: '/a', component: 'activateCmp' }, { path: '/a', component: 'activateCmp' },
{ path: '/b', component: 'oneCmp' } { path: '/b', component: 'oneCmp' }
]); ]);
compile('outer { <div ng-outlet></div> }'); compile('outer { <div ng-outlet></div> }');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('outer { hi }'); expect(elt.text()).toBe('outer { hi }');
$router.navigateByUrl('/b'); $rootRouter.navigateByUrl('/b');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('outer { hi }'); expect(elt.text()).toBe('outer { hi }');
}); });
@ -388,17 +388,17 @@ describe('Navigation lifecycle', function () {
} }
}); });
$router.config([ $rootRouter.config([
{ path: '/a', component: 'activateCmp' }, { path: '/a', component: 'activateCmp' },
{ path: '/b', component: 'oneCmp' } { path: '/b', component: 'oneCmp' }
]); ]);
compile('outer { <div ng-outlet></div> }'); compile('outer { <div ng-outlet></div> }');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('outer { hi }'); expect(elt.text()).toBe('outer { hi }');
$router.navigateByUrl('/b'); $rootRouter.navigateByUrl('/b');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('outer { one }'); expect(elt.text()).toBe('outer { one }');
}); });
@ -414,12 +414,12 @@ describe('Navigation lifecycle', function () {
$routerOnActivate: spy $routerOnActivate: spy
}); });
$router.config([ $rootRouter.config([
{ path: '/a', component: 'activateCmp' } { path: '/a', component: 'activateCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
expect(spy).toHaveBeenCalled(); expect(spy).toHaveBeenCalled();
@ -433,15 +433,15 @@ describe('Navigation lifecycle', function () {
$routerCanDeactivate: spy $routerCanDeactivate: spy
}); });
$router.config([ $rootRouter.config([
{ path: '/user/:name', component: 'deactivateCmp' }, { path: '/user/:name', component: 'deactivateCmp' },
{ path: '/post/:id', component: 'oneCmp' } { path: '/post/:id', component: 'oneCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/user/brian'); $rootRouter.navigateByUrl('/user/brian');
$rootScope.$digest(); $rootScope.$digest();
$router.navigateByUrl('/post/123'); $rootRouter.navigateByUrl('/post/123');
$rootScope.$digest(); $rootScope.$digest();
expect(spy).toHaveBeenCalledWith(instructionFor('oneCmp'), expect(spy).toHaveBeenCalledWith(instructionFor('oneCmp'),
instructionFor('deactivateCmp')); instructionFor('deactivateCmp'));

View File

@ -5,7 +5,7 @@ describe('navigation', function () {
var elt, var elt,
$compile, $compile,
$rootScope, $rootScope,
$router, $rootRouter,
$compileProvider; $compileProvider;
beforeEach(function () { beforeEach(function () {
@ -15,10 +15,10 @@ describe('navigation', function () {
$compileProvider = _$compileProvider_; $compileProvider = _$compileProvider_;
}); });
inject(function (_$compile_, _$rootScope_, _$router_) { inject(function (_$compile_, _$rootScope_, _$rootRouter_) {
$compile = _$compile_; $compile = _$compile_;
$rootScope = _$rootScope_; $rootScope = _$rootScope_;
$router = _$router_; $rootRouter = _$rootRouter_;
}); });
registerDirective('userCmp', { registerDirective('userCmp', {
@ -52,11 +52,11 @@ describe('navigation', function () {
it('should work in a simple case', function () { it('should work in a simple case', function () {
compile('<ng-outlet></ng-outlet>'); compile('<ng-outlet></ng-outlet>');
$router.config([ $rootRouter.config([
{ path: '/', component: 'oneCmp' } { path: '/', component: 'oneCmp' }
]); ]);
$router.navigateByUrl('/'); $rootRouter.navigateByUrl('/');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('one'); expect(elt.text()).toBe('one');
@ -66,11 +66,11 @@ describe('navigation', function () {
it('should work with components created by the `mod.component()` helper', function () { it('should work with components created by the `mod.component()` helper', function () {
compile('<ng-outlet></ng-outlet>'); compile('<ng-outlet></ng-outlet>');
$router.config([ $rootRouter.config([
{ path: '/', component: 'threeCmp' } { path: '/', component: 'threeCmp' }
]); ]);
$router.navigateByUrl('/'); $rootRouter.navigateByUrl('/');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('three'); expect(elt.text()).toBe('three');
@ -78,16 +78,16 @@ describe('navigation', function () {
it('should navigate between components with different parameters', function () { it('should navigate between components with different parameters', function () {
$router.config([ $rootRouter.config([
{ path: '/user/:name', component: 'userCmp' } { path: '/user/:name', component: 'userCmp' }
]); ]);
compile('<ng-outlet></ng-outlet>'); compile('<ng-outlet></ng-outlet>');
$router.navigateByUrl('/user/brian'); $rootRouter.navigateByUrl('/user/brian');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('hello brian'); expect(elt.text()).toBe('hello brian');
$router.navigateByUrl('/user/igor'); $rootRouter.navigateByUrl('/user/igor');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('hello igor'); expect(elt.text()).toBe('hello igor');
}); });
@ -106,17 +106,17 @@ describe('navigation', function () {
controller: ParentController controller: ParentController
}); });
$router.config([ $rootRouter.config([
{ path: '/parent/...', component: 'parentCmp' } { path: '/parent/...', component: 'parentCmp' }
]); ]);
compile('<ng-outlet></ng-outlet>'); compile('<ng-outlet></ng-outlet>');
$router.navigateByUrl('/parent/user/brian'); $rootRouter.navigateByUrl('/parent/user/brian');
$rootScope.$digest(); $rootScope.$digest();
expect(instanceCount).toBe(1); expect(instanceCount).toBe(1);
expect(elt.text()).toBe('parent { hello brian }'); expect(elt.text()).toBe('parent { hello brian }');
$router.navigateByUrl('/parent/user/igor'); $rootRouter.navigateByUrl('/parent/user/igor');
$rootScope.$digest(); $rootScope.$digest();
expect(instanceCount).toBe(1); expect(instanceCount).toBe(1);
expect(elt.text()).toBe('parent { hello igor }'); expect(elt.text()).toBe('parent { hello igor }');
@ -131,12 +131,12 @@ describe('navigation', function () {
] ]
}); });
$router.config([ $rootRouter.config([
{ path: '/a/...', component: 'childCmp' } { path: '/a/...', component: 'childCmp' }
]); ]);
compile('<div>outer { <div ng-outlet></div> }</div>'); compile('<div>outer { <div ng-outlet></div> }</div>');
$router.navigateByUrl('/a/b'); $rootRouter.navigateByUrl('/a/b');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('outer { inner { one } }'); expect(elt.text()).toBe('outer { inner { one } }');
@ -150,12 +150,12 @@ describe('navigation', function () {
] ]
}); });
$router.config([ $rootRouter.config([
{ path: '/...', component: 'childCmp' } { path: '/...', component: 'childCmp' }
]); ]);
compile('<div>outer { <div ng-outlet></div> }</div>'); compile('<div>outer { <div ng-outlet></div> }</div>');
$router.navigateByUrl('/b'); $rootRouter.navigateByUrl('/b');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('outer { inner { one } }'); expect(elt.text()).toBe('outer { inner { one } }');
@ -171,26 +171,26 @@ describe('navigation', function () {
{ path: '/end', component: 'oneCmp' } { path: '/end', component: 'oneCmp' }
]}); ]});
$router.config([ $rootRouter.config([
{ path: '/recur', component: 'recurCmp' }, { path: '/recur', component: 'recurCmp' },
{ path: '/', component: 'oneCmp' } { path: '/', component: 'oneCmp' }
]); ]);
compile('<div>root { <div ng-outlet></div> }</div>'); compile('<div>root { <div ng-outlet></div> }</div>');
$router.navigateByUrl('/recur/recur/end'); $rootRouter.navigateByUrl('/recur/recur/end');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('root { one }'); expect(elt.text()).toBe('root { one }');
}); });
it('should change location path', inject(function ($location) { it('should change location path', inject(function ($location) {
$router.config([ $rootRouter.config([
{ path: '/user', component: 'userCmp' } { path: '/user', component: 'userCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/user'); $rootRouter.navigateByUrl('/user');
$rootScope.$digest(); $rootScope.$digest();
expect($location.path()).toBe('/user'); expect($location.path()).toBe('/user');
@ -198,13 +198,13 @@ describe('navigation', function () {
it('should pass through query terms to the location', inject(function ($location) { it('should pass through query terms to the location', inject(function ($location) {
$router.config([ $rootRouter.config([
{ path: '/user', component: 'userCmp' } { path: '/user', component: 'userCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/user?x=y'); $rootRouter.navigateByUrl('/user?x=y');
$rootScope.$digest(); $rootScope.$digest();
expect($location.path()).toBe('/user'); expect($location.path()).toBe('/user');
@ -215,12 +215,12 @@ describe('navigation', function () {
it('should change location to the canonical route', inject(function ($location) { it('should change location to the canonical route', inject(function ($location) {
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.config([ $rootRouter.config([
{ path: '/', redirectTo: ['/User'] }, { path: '/', redirectTo: ['/User'] },
{ path: '/user', component: 'userCmp', name: 'User' } { path: '/user', component: 'userCmp', name: 'User' }
]); ]);
$router.navigateByUrl('/'); $rootRouter.navigateByUrl('/');
$rootScope.$digest(); $rootScope.$digest();
expect($location.path()).toBe('/user'); expect($location.path()).toBe('/user');
@ -236,7 +236,7 @@ describe('navigation', function () {
] ]
}); });
$router.config([ $rootRouter.config([
{ path: '/old-parent/old-child', redirectTo: ['/NewParent', 'NewChild'] }, { path: '/old-parent/old-child', redirectTo: ['/NewParent', 'NewChild'] },
{ path: '/old-parent/old-child-two', redirectTo: ['/NewParent', 'NewChildTwo'] }, { path: '/old-parent/old-child-two', redirectTo: ['/NewParent', 'NewChildTwo'] },
{ path: '/new-parent/...', component: 'childRouter', name: 'NewParent' } { path: '/new-parent/...', component: 'childRouter', name: 'NewParent' }
@ -244,13 +244,13 @@ describe('navigation', function () {
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/old-parent/old-child'); $rootRouter.navigateByUrl('/old-parent/old-child');
$rootScope.$digest(); $rootScope.$digest();
expect($location.path()).toBe('/new-parent/new-child'); expect($location.path()).toBe('/new-parent/new-child');
expect(elt.text()).toBe('inner { one }'); expect(elt.text()).toBe('inner { one }');
$router.navigateByUrl('/old-parent/old-child-two'); $rootRouter.navigateByUrl('/old-parent/old-child-two');
$rootScope.$digest(); $rootScope.$digest();
expect($location.path()).toBe('/new-parent/new-child-two'); expect($location.path()).toBe('/new-parent/new-child-two');
@ -259,7 +259,7 @@ describe('navigation', function () {
it('should navigate when the location path changes', inject(function ($location) { it('should navigate when the location path changes', inject(function ($location) {
$router.config([ $rootRouter.config([
{ path: '/one', component: 'oneCmp' } { path: '/one', component: 'oneCmp' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
@ -272,7 +272,7 @@ describe('navigation', function () {
it('should navigate when the location query changes', inject(function ($location) { it('should navigate when the location query changes', inject(function ($location) {
$router.config([ $rootRouter.config([
{ path: '/get/params', component: 'getParams' } { path: '/get/params', component: 'getParams' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
@ -284,7 +284,7 @@ describe('navigation', function () {
})); }));
it('should expose a "navigating" property on $router', inject(function ($q) { it('should expose a "navigating" property on $rootRouter', inject(function ($q) {
var defer; var defer;
registerDirective('pendingActivate', { registerDirective('pendingActivate', {
$canActivate: function () { $canActivate: function () {
@ -292,17 +292,17 @@ describe('navigation', function () {
return defer.promise; return defer.promise;
} }
}); });
$router.config([ $rootRouter.config([
{ path: '/pending-activate', component: 'pendingActivate' } { path: '/pending-activate', component: 'pendingActivate' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/pending-activate'); $rootRouter.navigateByUrl('/pending-activate');
$rootScope.$digest(); $rootScope.$digest();
expect($router.navigating).toBe(true); expect($rootRouter.navigating).toBe(true);
defer.resolve(); defer.resolve();
$rootScope.$digest(); $rootScope.$digest();
expect($router.navigating).toBe(false); expect($rootRouter.navigating).toBe(false);
})); }));
function registerDirective(name, options) { function registerDirective(name, options) {

View File

@ -5,7 +5,7 @@ describe('router', function () {
var elt, var elt,
$compile, $compile,
$rootScope, $rootScope,
$router, $rootRouter,
$compileProvider; $compileProvider;
beforeEach(function () { beforeEach(function () {
@ -18,10 +18,10 @@ describe('router', function () {
$compileProvider = _$compileProvider_; $compileProvider = _$compileProvider_;
}); });
inject(function (_$compile_, _$rootScope_, _$router_) { inject(function (_$compile_, _$rootScope_, _$rootRouter_) {
$compile = _$compile_; $compile = _$compile_;
$rootScope = _$rootScope_; $rootScope = _$rootScope_;
$router = _$router_; $rootRouter = _$rootRouter_;
}); });
}); });

View File

@ -5,7 +5,7 @@ describe('ngRoute shim', function () {
var elt, var elt,
$compile, $compile,
$rootScope, $rootScope,
$router, $rootRouter,
$compileProvider, $compileProvider,
$routeProvider; $routeProvider;
@ -18,10 +18,10 @@ describe('ngRoute shim', function () {
$routeProvider = _$routeProvider_; $routeProvider = _$routeProvider_;
}); });
inject(function (_$compile_, _$rootScope_, _$router_) { inject(function (_$compile_, _$rootScope_, _$rootRouter_) {
$compile = _$compile_; $compile = _$compile_;
$rootScope = _$rootScope_; $rootScope = _$rootScope_;
$router = _$router_; $rootRouter = _$rootRouter_;
}); });
}); });
@ -36,7 +36,7 @@ describe('ngRoute shim', function () {
compile('<ng-outlet></ng-outlet>'); compile('<ng-outlet></ng-outlet>');
$router.navigateByUrl('/'); $rootRouter.navigateByUrl('/');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('one'); expect(elt.text()).toBe('one');
@ -55,7 +55,7 @@ describe('ngRoute shim', function () {
compile('root {<ng-outlet></ng-outlet>}'); compile('root {<ng-outlet></ng-outlet>}');
$router.navigateByUrl('/'); $rootRouter.navigateByUrl('/');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('root {one}'); expect(elt.text()).toBe('root {one}');
})); }));
@ -76,7 +76,7 @@ describe('ngRoute shim', function () {
compile('<ng-outlet></ng-outlet>'); compile('<ng-outlet></ng-outlet>');
$router.navigateByUrl('/'); $rootRouter.navigateByUrl('/');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('value: 42'); expect(elt.text()).toBe('value: 42');
@ -94,11 +94,11 @@ describe('ngRoute shim', function () {
compile('<ng-outlet></ng-outlet>'); compile('<ng-outlet></ng-outlet>');
$router.navigateByUrl('/user/brian'); $rootRouter.navigateByUrl('/user/brian');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('hello brian'); expect(elt.text()).toBe('hello brian');
$router.navigateByUrl('/user/igor'); $rootRouter.navigateByUrl('/user/igor');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('hello igor'); expect(elt.text()).toBe('hello igor');
}); });
@ -115,7 +115,7 @@ describe('ngRoute shim', function () {
compile('<ng-outlet></ng-outlet>'); compile('<ng-outlet></ng-outlet>');
$router.navigateByUrl('/home/foo/bar/123'); $rootRouter.navigateByUrl('/home/foo/bar/123');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('rest: foo/bar/123'); expect(elt.text()).toBe('rest: foo/bar/123');
}); });
@ -129,7 +129,7 @@ describe('ngRoute shim', function () {
compile('root {<ng-outlet></ng-outlet>}'); compile('root {<ng-outlet></ng-outlet>}');
$router.navigateByUrl('/home/test'); $rootRouter.navigateByUrl('/home/test');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('root {}'); expect(elt.text()).toBe('root {}');
expect(console.warn) expect(console.warn)
@ -150,7 +150,7 @@ describe('ngRoute shim', function () {
compile('root {<ng-outlet></ng-outlet>}'); compile('root {<ng-outlet></ng-outlet>}');
$router.navigateByUrl('/'); $rootRouter.navigateByUrl('/');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('root {welcome home!}'); expect(elt.text()).toBe('root {welcome home!}');
expect($location.path()).toBe('/home'); expect($location.path()).toBe('/home');
@ -169,7 +169,7 @@ describe('ngRoute shim', function () {
compile('root {<ng-outlet></ng-outlet>}'); compile('root {<ng-outlet></ng-outlet>}');
$router.navigateByUrl('/somewhere'); $rootRouter.navigateByUrl('/somewhere');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.text()).toBe('root {welcome home!}'); expect(elt.text()).toBe('root {welcome home!}');
expect($location.path()).toBe('/home'); expect($location.path()).toBe('/home');

View File

@ -5,7 +5,7 @@ describe('ngLink', function () {
var elt, var elt,
$compile, $compile,
$rootScope, $rootScope,
$router, $rootRouter,
$compileProvider; $compileProvider;
beforeEach(function () { beforeEach(function () {
@ -15,10 +15,10 @@ describe('ngLink', function () {
$compileProvider = _$compileProvider_; $compileProvider = _$compileProvider_;
}); });
inject(function (_$compile_, _$rootScope_, _$router_) { inject(function (_$compile_, _$rootScope_, _$rootRouter_) {
$compile = _$compile_; $compile = _$compile_;
$rootScope = _$rootScope_; $rootScope = _$rootScope_;
$router = _$router_; $rootRouter = _$rootRouter_;
}); });
registerComponent('userCmp', '<div>hello {{userCmp.$routeParams.name}}</div>', function () {}); registerComponent('userCmp', '<div>hello {{userCmp.$routeParams.name}}</div>', function () {});
@ -28,26 +28,26 @@ describe('ngLink', function () {
it('should allow linking from the parent to the child', function () { it('should allow linking from the parent to the child', function () {
$router.config([ $rootRouter.config([
{ path: '/a', component: 'oneCmp' }, { path: '/a', component: 'oneCmp' },
{ path: '/b', component: 'twoCmp', name: 'Two' } { path: '/b', component: 'twoCmp', name: 'Two' }
]); ]);
compile('<a ng-link="[\'/Two\']">link</a> | outer { <div ng-outlet></div> }'); compile('<a ng-link="[\'/Two\']">link</a> | outer { <div ng-outlet></div> }');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.find('a').attr('href')).toBe('./b'); expect(elt.find('a').attr('href')).toBe('./b');
}); });
it('should allow linking from the child and the parent', function () { it('should allow linking from the child and the parent', function () {
$router.config([ $rootRouter.config([
{ path: '/a', component: 'oneCmp' }, { path: '/a', component: 'oneCmp' },
{ path: '/b', component: 'twoCmp', name: 'Two' } { path: '/b', component: 'twoCmp', name: 'Two' }
]); ]);
compile('outer { <div ng-outlet></div> }'); compile('outer { <div ng-outlet></div> }');
$router.navigateByUrl('/b'); $rootRouter.navigateByUrl('/b');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.find('a').attr('href')).toBe('./b'); expect(elt.find('a').attr('href')).toBe('./b');
@ -57,13 +57,13 @@ describe('ngLink', function () {
it('should allow params in routerLink directive', function () { it('should allow params in routerLink directive', function () {
registerComponent('twoLinkCmp', '<div><a ng-link="[\'/Two\', {param: \'lol\'}]">{{twoLinkCmp.number}}</a></div>', function () {this.number = 'two'}); registerComponent('twoLinkCmp', '<div><a ng-link="[\'/Two\', {param: \'lol\'}]">{{twoLinkCmp.number}}</a></div>', function () {this.number = 'two'});
$router.config([ $rootRouter.config([
{ path: '/a', component: 'twoLinkCmp' }, { path: '/a', component: 'twoLinkCmp' },
{ path: '/b/:param', component: 'twoCmp', name: 'Two' } { path: '/b/:param', component: 'twoCmp', name: 'Two' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.find('a').attr('href')).toBe('./b/lol'); expect(elt.find('a').attr('href')).toBe('./b/lol');
@ -72,13 +72,13 @@ describe('ngLink', function () {
it('should update the href of links with bound params', function () { it('should update the href of links with bound params', function () {
registerComponent('twoLinkCmp', '<div><a ng-link="[\'/Two\', {param: twoLinkCmp.number}]">{{twoLinkCmp.number}}</a></div>', function () {this.number = 'param'}); registerComponent('twoLinkCmp', '<div><a ng-link="[\'/Two\', {param: twoLinkCmp.number}]">{{twoLinkCmp.number}}</a></div>', function () {this.number = 'param'});
$router.config([ $rootRouter.config([
{ path: '/a', component: 'twoLinkCmp' }, { path: '/a', component: 'twoLinkCmp' },
{ path: '/b/:param', component: 'twoCmp', name: 'Two' } { path: '/b/:param', component: 'twoCmp', name: 'Two' }
]); ]);
compile('<div ng-outlet></div>'); compile('<div ng-outlet></div>');
$router.navigateByUrl('/a'); $rootRouter.navigateByUrl('/a');
$rootScope.$digest(); $rootScope.$digest();
expect(elt.find('a').attr('href')).toBe('./b/param'); expect(elt.find('a').attr('href')).toBe('./b/param');
@ -86,7 +86,7 @@ describe('ngLink', function () {
it('should navigate on left-mouse click when a link url matches a route', function () { it('should navigate on left-mouse click when a link url matches a route', function () {
$router.config([ $rootRouter.config([
{ path: '/', component: 'oneCmp' }, { path: '/', component: 'oneCmp' },
{ path: '/two', component: 'twoCmp', name: 'Two'} { path: '/two', component: 'twoCmp', name: 'Two'}
]); ]);
@ -104,8 +104,8 @@ describe('ngLink', function () {
}); });
it('should not navigate on non-left mouse click when a link url matches a route', inject(function ($router) { it('should not navigate on non-left mouse click when a link url matches a route', inject(function ($rootRouter) {
$router.config([ $rootRouter.config([
{ path: '/', component: 'oneCmp' }, { path: '/', component: 'oneCmp' },
{ path: '/two', component: 'twoCmp', name: 'Two'} { path: '/two', component: 'twoCmp', name: 'Two'}
]); ]);
@ -122,7 +122,7 @@ describe('ngLink', function () {
// See https://github.com/angular/router/issues/206 // See https://github.com/angular/router/issues/206
it('should not navigate a link without an href', function () { it('should not navigate a link without an href', function () {
$router.config([ $rootRouter.config([
{ path: '/', component: 'oneCmp' }, { path: '/', component: 'oneCmp' },
{ path: '/two', component: 'twoCmp', name: 'Two'} { path: '/two', component: 'twoCmp', name: 'Two'}
]); ]);

View File

@ -22,7 +22,7 @@ function provideHelpers(fn, preInject) {
var elt, var elt,
$compile, $compile,
$rootScope, $rootScope,
$router, $rootRouter,
$templateCache, $templateCache,
$controllerProvider; $controllerProvider;
@ -32,10 +32,10 @@ function provideHelpers(fn, preInject) {
$controllerProvider = _$controllerProvider_; $controllerProvider = _$controllerProvider_;
}); });
inject(function(_$compile_, _$rootScope_, _$router_, _$templateCache_) { inject(function(_$compile_, _$rootScope_, _$rootRouter_, _$templateCache_) {
$compile = _$compile_; $compile = _$compile_;
$rootScope = _$rootScope_; $rootScope = _$rootScope_;
$router = _$router_; $rootRouter = _$rootRouter_;
$templateCache = _$templateCache_; $templateCache = _$templateCache_;
}); });
@ -72,7 +72,7 @@ function provideHelpers(fn, preInject) {
fn({ fn({
registerComponent: registerComponent, registerComponent: registerComponent,
$router: $router, $rootRouter: $rootRouter,
put: put, put: put,
compile: compile compile: compile
}) })