fix(compiler): support multiple components in a view container

This commit is contained in:
Tobias Bosch 2016-11-01 14:21:40 -07:00
parent 234c5599f1
commit 6fda97287e
2 changed files with 26 additions and 12 deletions

View File

@ -42,7 +42,7 @@ export function buildView(
const parentEl = const parentEl =
view.declarationElement.isNull() ? view.declarationElement : view.declarationElement.parent; view.declarationElement.isNull() ? view.declarationElement : view.declarationElement.parent;
templateVisitAll(builderVisitor, template, parentEl); templateVisitAll(builderVisitor, template, parentEl);
if (view.viewType === ViewType.EMBEDDED) { if (view.viewType === ViewType.EMBEDDED || view.viewType === ViewType.HOST) {
view.lastRenderNode = builderVisitor.getOrCreateLastRenderNode(); view.lastRenderNode = builderVisitor.getOrCreateLastRenderNode();
} }
return builderVisitor.nestedViewCount; return builderVisitor.nestedViewCount;

View File

@ -972,11 +972,24 @@ function declareTests({useJit}: {useJit: boolean}) {
.createComponent(MyComp); .createComponent(MyComp);
var tc = fixture.debugElement.children[0].children[0]; var tc = fixture.debugElement.children[0].children[0];
var dynamicVp: DynamicViewport = tc.injector.get(DynamicViewport); var dynamicVp: DynamicViewport = tc.injector.get(DynamicViewport);
dynamicVp.done.then((_) => { dynamicVp.create();
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.debugElement.children[0].children[1].nativeElement) expect(fixture.debugElement.children[0].children[1].nativeElement)
.toHaveText('dynamic greet'); .toHaveText('dynamic greet');
}); }));
it('should allow to create multiple ViewContainerRef at a location', async(() => {
var fixture = TestBed.configureTestingModule({schemas: [NO_ERRORS_SCHEMA]})
.createComponent(MyComp);
var tc = fixture.debugElement.children[0].children[0];
var dynamicVp: DynamicViewport = tc.injector.get(DynamicViewport);
dynamicVp.create();
dynamicVp.create();
fixture.detectChanges();
expect(fixture.debugElement.children[0].children[1].nativeElement)
.toHaveText('dynamic greet');
expect(fixture.debugElement.children[0].children[2].nativeElement)
.toHaveText('dynamic greet');
})); }));
}); });
@ -1657,17 +1670,18 @@ class SimpleImperativeViewComponent {
@Directive({selector: 'dynamic-vp'}) @Directive({selector: 'dynamic-vp'})
class DynamicViewport { class DynamicViewport {
done: Promise<any>; private componentFactory: ComponentFactory<ChildCompUsingService>;
constructor(vc: ViewContainerRef, componentFactoryResolver: ComponentFactoryResolver) { private injector: Injector;
constructor(private vc: ViewContainerRef, componentFactoryResolver: ComponentFactoryResolver) {
var myService = new MyService(); var myService = new MyService();
myService.greeting = 'dynamic greet'; myService.greeting = 'dynamic greet';
var injector = ReflectiveInjector.resolveAndCreate( this.injector = ReflectiveInjector.resolveAndCreate(
[{provide: MyService, useValue: myService}], vc.injector); [{provide: MyService, useValue: myService}], vc.injector);
this.done = this.componentFactory = componentFactoryResolver.resolveComponentFactory(ChildCompUsingService);
Promise.resolve(componentFactoryResolver.resolveComponentFactory(ChildCompUsingService))
.then((componentFactory) => vc.createComponent(componentFactory, 0, injector));
} }
create() { this.vc.createComponent(this.componentFactory, this.vc.length, this.injector); }
} }
@Directive({selector: '[my-dir]', inputs: ['dirProp: elprop'], exportAs: 'mydir'}) @Directive({selector: '[my-dir]', inputs: ['dirProp: elprop'], exportAs: 'mydir'})