I need to use the ComponentFactory.create() method with the 3rd parameter provided (rootSelectorOrNode) which represents a g
node of a SVG template.
So I used a directive like that :
@ViewChild('objHost', {read: ViewContainerRef}) objHost: ViewContainerRef;
...
ngAfterViewInit(): void {
this.add( ... my component with data );
this.add( ... Second new instance my component with other data);
}
...
public add(myComp: MyComponent): void {
const componentFactory: ComponentFactory<any> = this.componentFactoryResolver.resolveComponentFactory(myComp.component);
const componentRef = componentFactory.create(this.injector, [], this.objHost.nativeElement);
this.objHost.insert(componentRef.hostView);
}
with in view:
<g #objHost></g>
The problem is, in the final DOM, only the last component is added.
The first one is replaced or erased.
Why can I not add several component with this method ?
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…