5205a9e65f
BREAKING CHANGE:
Previously, route configuration took a controller constructor function as the value of
`component` in a route definition:
```
$route.config([
{ route: '/', component: MyController }
])
```
Based on the name of the controller, we used to use a componentMapper service to
determine what template to pair with each controller, how to bind the instance to
the $scope.
To make the 1.x router more semantically alligned with Angular 2, we now route to a directive.
Thus a route configuration takes a normalized directive name:
```
$route.config([
{ route: '/', component: 'myDirective' }
])
```
BREAKING CHANGE:
In order to avoid name collisions, lifecycle hooks are now prefixed with `$`. Before:
```
MyController.prototype.onActivate = ...
```
After:
```
MyController.prototype.$onActivate = ...
```
Same for `$canActivate` (which now lives on the directive factory function),
`$canDeactivate`, `$canReuse`, and `$onDeactivate` hooks.
67 lines
2.2 KiB
JavaScript
67 lines
2.2 KiB
JavaScript
|
|
angular.module('ngComponentRouter').
|
|
value('$route', null). // can be overloaded with ngRouteShim
|
|
factory('$router', ['$q', '$location', '$$directiveIntrospector', '$browser', '$rootScope', '$injector', '$route', routerFactory]);
|
|
|
|
function routerFactory($q, $location, $$directiveIntrospector, $browser, $rootScope, $injector) {
|
|
|
|
// When this file is processed, the line below is replaced with
|
|
// the contents of `../lib/facades.es5`.
|
|
//{{FACADES}}
|
|
|
|
var exports = {Injectable: function () {}};
|
|
var require = function () {return exports;};
|
|
|
|
// When this file is processed, the line below is replaced with
|
|
// the contents of the compiled TypeScript classes.
|
|
//{{SHARED_CODE}}
|
|
|
|
//TODO: this is a hack to replace the exiting implementation at run-time
|
|
exports.getCanActivateHook = function (directiveName) {
|
|
var factory = $$directiveIntrospector.getTypeByName(directiveName);
|
|
return factory && factory.$canActivate && function (next, prev) {
|
|
return $injector.invoke(factory.$canActivate, null, {
|
|
$nextInstruction: next,
|
|
$prevInstruction: prev
|
|
});
|
|
};
|
|
};
|
|
|
|
// This hack removes assertions about the type of the "component"
|
|
// property in a route config
|
|
exports.assertComponentExists = function () {};
|
|
|
|
angular.stringifyInstruction = exports.stringifyInstruction;
|
|
|
|
var RouteRegistry = exports.RouteRegistry;
|
|
var RootRouter = exports.RootRouter;
|
|
|
|
var registry = new RouteRegistry();
|
|
var location = new Location();
|
|
|
|
$$directiveIntrospector(function (name, factory) {
|
|
if (angular.isArray(factory.$routeConfig)) {
|
|
factory.$routeConfig.forEach(function (config) {
|
|
registry.config(name, config);
|
|
});
|
|
}
|
|
});
|
|
|
|
// Because Angular 1 has no notion of a root component, we use an object with unique identity
|
|
// to represent this.
|
|
var ROOT_COMPONENT_OBJECT = new Object();
|
|
|
|
var router = new RootRouter(registry, location, ROOT_COMPONENT_OBJECT);
|
|
$rootScope.$watch(function () { return $location.path(); }, function (path) {
|
|
if (router.lastNavigationAttempt !== path) {
|
|
router.navigateByUrl(path);
|
|
}
|
|
});
|
|
|
|
router.subscribe(function () {
|
|
$rootScope.$broadcast('$routeChangeSuccess', {});
|
|
});
|
|
|
|
return router;
|
|
}
|