0

I'm creating a component in a separated library that have to render a component defined in a configuration object.

I found this question on stackOverflow that enable a dynamically rendered component, using ng-container and *ngComponentOutlet, to emit an output event from the component, but is is 4 years old.

I try to make the same thing with angular 16 but i cannot reach the same result.

I have created a directive but when i apply it to ng-container it seems that the constructor of the directive is not called and i don't understand why.

Here the example of my template

  <ng-container *ngFor="let definition of definitions">
    <ng-container *ngIf="definition.resultComponent">
      <ng-container customViewer (resultSelection)="select($event)" *ngComponentOutlet="definition.resultComponent; injector: resultInjector"></ng-container>
      </ng-container>
    ......
    </ng-container>

And this one is the directive

@Directive({
  selector: '[customViewer]'
})
export class CustomViewerDirective {
  @Output() resultSelection: EventEmitter<Data> = new EventEmitter<Data>();

  constructor(private container: ViewContainerRef) {
    console.log(this.container)
  }
}

I only put the console.log in the constructor just to be sure that the directive instance is created, but there is no print in the console, but if i apply it in a "normal" tag it works.

Any idea?

AngelPoyel
  • 160
  • 1
  • 9

0 Answers0