fix(upgrade): allow deeper nesting of ng2 components/directives (#8949)

* fix(upgrade): add test for upgrade adapter bug

* fix(upgrade): allow deeper nesting of ng2 components/directives

allow a nesting sequence of ng2 > ng1 > ng2 directives
This commit is contained in:
Hannah Howard 2016-06-01 15:58:40 -07:00 committed by Miško Hevery
parent 21fc1bb655
commit 48bf349c3c
2 changed files with 42 additions and 2 deletions

View File

@ -547,8 +547,6 @@ function ng1ComponentDirective(info: ComponentInfo, idPrefix: string): Function
function directiveFactory(ng1Injector: angular.IInjectorService,
componentFactoryRefMap: ComponentFactoryRefMap,
parse: angular.IParseService): angular.IDirective {
var componentFactory: ComponentFactory<any> = componentFactoryRefMap[info.selector];
if (!componentFactory) throw new Error('Expecting ComponentFactory for: ' + info.selector);
var idCount = 0;
return {
restrict: 'E',
@ -556,6 +554,9 @@ function ng1ComponentDirective(info: ComponentInfo, idPrefix: string): Function
link: {
post: (scope: angular.IScope, element: angular.IAugmentedJQuery, attrs: angular.IAttributes,
parentInjector: any, transclude: angular.ITranscludeFunction): void => {
var componentFactory: ComponentFactory<any> = componentFactoryRefMap[info.selector];
if (!componentFactory) throw new Error('Expecting ComponentFactory for: ' + info.selector);
var domElement = <any>element[0];
if (parentInjector === null) {
parentInjector = ng1Injector.get(NG2_INJECTOR);

View File

@ -709,6 +709,45 @@ export function main() {
async.done();
});
}));
it('should support ng2 > ng1 > ng2', inject([AsyncTestCompleter], (async) => {
var adapter = new UpgradeAdapter();
var ng1Module = angular.module('ng1', []);
var ng1 = {
template: 'ng1(<ng2b></ng2b>)',
};
ng1Module.component('ng1', ng1);
var Ng2a =
Component({
selector: 'ng2a',
template: 'ng2a(<ng1></ng1>)',
directives: [adapter.upgradeNg1Component('ng1')]
})
.Class({
constructor: function() {}
});
ng1Module.directive('ng2a', adapter.downgradeNg2Component(Ng2a));
var Ng2b =
Component({
selector: 'ng2b',
template: 'ng2b',
directives: []
})
.Class({
constructor: function() {}
});
ng1Module.directive('ng2b', adapter.downgradeNg2Component(Ng2b));
var element = html(`<div><ng2a></ng2a></div>`);
adapter.bootstrap(element, ['ng1'])
.ready((ref) => {
expect(multiTrim(document.body.textContent)).toEqual('ng2a(ng1(ng2b))');
async.done();
});
}));
});
describe('injection', () => {