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.
81 lines
1.8 KiB
JavaScript
81 lines
1.8 KiB
JavaScript
/*
|
|
* Helpers to keep tests DRY
|
|
*/
|
|
|
|
function componentTemplatePath(name) {
|
|
return './components/' + dashCase(name) + '/' + dashCase(name) + '.html';
|
|
}
|
|
|
|
function componentControllerName(name) {
|
|
return name[0].toUpperCase() + name.substr(1) + 'Controller';
|
|
}
|
|
|
|
function dashCase(str) {
|
|
return str.replace(/([A-Z])/g, function ($1) {
|
|
return '-' + $1.toLowerCase();
|
|
});
|
|
}
|
|
|
|
|
|
function provideHelpers(fn, preInject) {
|
|
return function () {
|
|
var elt,
|
|
$compile,
|
|
$rootScope,
|
|
$router,
|
|
$templateCache,
|
|
$controllerProvider;
|
|
|
|
module('ng');
|
|
module('ngNewRouter');
|
|
module(function(_$controllerProvider_) {
|
|
$controllerProvider = _$controllerProvider_;
|
|
});
|
|
|
|
inject(function(_$compile_, _$rootScope_, _$router_, _$templateCache_) {
|
|
$compile = _$compile_;
|
|
$rootScope = _$rootScope_;
|
|
$router = _$router_;
|
|
$templateCache = _$templateCache_;
|
|
});
|
|
|
|
function registerComponent(name, template, config) {
|
|
if (!template) {
|
|
template = '';
|
|
}
|
|
var ctrl;
|
|
if (!config) {
|
|
ctrl = function () {};
|
|
} else if (angular.isArray(config)) {
|
|
ctrl = function () {};
|
|
ctrl.$routeConfig = config;
|
|
} else if (typeof config === 'function') {
|
|
ctrl = config;
|
|
} else {
|
|
ctrl = function () {};
|
|
ctrl.prototype = config;
|
|
}
|
|
$controllerProvider.register(componentControllerName(name), ctrl);
|
|
put(name, template);
|
|
}
|
|
|
|
|
|
function put (name, template) {
|
|
$templateCache.put(componentTemplatePath(name), [200, template, {}]);
|
|
}
|
|
|
|
function compile(template) {
|
|
var elt = $compile('<div>' + template + '</div>')($rootScope);
|
|
$rootScope.$digest();
|
|
return elt;
|
|
}
|
|
|
|
fn({
|
|
registerComponent: registerComponent,
|
|
$router: $router,
|
|
put: put,
|
|
compile: compile
|
|
})
|
|
}
|
|
}
|