Angular, get ViewChild / ViewContainerRef from a dynamically created component

Question

Is there a way to get ViewContainerRef from a dynamically created component? My dynamically created component has an ngContent element inside, which I want to fill after dynamic creation.

export class Example {

  @ViewChild('content', { read: ViewContainerRef }) //normal way
  content: ViewContainerRef;

...

  ngAfterViewInit(){
    let box1=this.content.createComponent(this.boxFactory);
    box1.instance.title="Dynamic (1)";
    // HERE: the box1 has a ng-content area which i want to fill.
  }

}

I am thinking of some manual way to enable ViewChild instead of using decorators. Some ideas?

Many thanks.

Answer 1

I'm also not sure how to dynamically add a viewchild. however, if the dynamic ViewContainerRef is what you want, you can try using this solution:

in the html file create:

  <div id="test"></div>

in your create component:

 let nodeElement = document.getElementById("test");
      let compFactory = this.componentFactoryResolver.resolveComponentFactory(ChildComponent);
      let component = compFactory.create(this.viewContainerRef.injector, null, nodeElement);

Answer 2

, , :

https://blog.angularindepth.com/here-is-how-to-get-viewcontainerref-before-viewchild-query-is-evaluated-f649e51315fb

https://blog.angularindepth.com/here-is-what-you-need-to-know-about-dynamic-components-in-angular-ac1e96167f9e

angular Github, .