feat(upgrade): support bindToController with binding definitions

Since angular 1.4 we can also pass controller bindings directly to bindToController, making this syntax more convenient

Closes #4784
This commit is contained in:
Pascal Precht 2015-11-13 18:55:40 +01:00 committed by Alex Eagle
parent 5c782d6ba8
commit 99e6500a2d
2 changed files with 42 additions and 6 deletions

View File

@ -78,11 +78,18 @@ export class UpgradeNg1ComponentAdapterBuilder {
}
extractBindings() {
var scope = this.directive.scope;
if (typeof scope == 'object') {
for (var name in scope) {
if ((<any>scope).hasOwnProperty(name)) {
var localName = scope[name];
var btcIsObject = typeof this.directive.bindToController === 'object';
if (btcIsObject && Object.keys(this.directive.scope).length) {
throw new Error(
`Binding definitions on scope and controller at the same time are not supported.`);
}
var context = (btcIsObject) ? this.directive.bindToController : this.directive.scope;
if (typeof context == 'object') {
for (var name in context) {
if ((<any>context).hasOwnProperty(name)) {
var localName = context[name];
var type = localName.charAt(0);
localName = localName.substr(1) || name;
var outputName = 'output_' + name;
@ -109,7 +116,7 @@ export class UpgradeNg1ComponentAdapterBuilder {
this.propertyMap[outputName] = localName;
break;
default:
var json = JSON.stringify(scope);
var json = JSON.stringify(context);
throw new Error(
`Unexpected mapping '${type}' in '${json}' in '${this.name}' directive.`);
}

View File

@ -417,6 +417,35 @@ export function main() {
});
}));
it('should support bindToController with bindings', inject([AsyncTestCompleter], (async) => {
var adapter = new UpgradeAdapter();
var ng1Module = angular.module('ng1', []);
var ng1 = function() {
return {
scope: {},
bindToController: {title: '@'},
template: '{{ctl.title}}',
controllerAs: 'ctl',
controller: Class({constructor: function() {}})
};
};
ng1Module.directive('ng1', ng1);
var Ng2 = Component({
selector: 'ng2',
template: '<ng1 title="WORKS"></ng1>',
directives: [adapter.upgradeNg1Component('ng1')]
}).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
var element = html(`<div><ng2></ng2></div>`);
adapter.bootstrap(element, ['ng1'])
.ready((ref) => {
expect(multiTrim(document.body.textContent)).toEqual('WORKS');
ref.dispose();
async.done();
});
}));
it('should support single require in linking fn', inject([AsyncTestCompleter], (async) => {
var adapter = new UpgradeAdapter();
var ng1Module = angular.module('ng1', []);