Accesing a dynamic component

[st-clair-clarke]

Hi, Given the following:

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular 6';
  component = DynamicComponent;
  onClick($event) {
    alert($event);
  }
}

How do I access the instance of the DynamicComponent to set a property? Attempting access in a @ViewChild() does not seem to work.

NB. I note that the docs state that there is access to the component? I can't seem to get it though

[thekiba]

I want to remind that it is more convenient to use auto binding on the dynamic component. *ngxComponentOutlet makes auto binding and inputs and outputs.

<ng-container *ngxComponentOutlet="component"></ng-container>
// instead of
<app-dynamic [ngxComponentOutlet]="component" [Input]="..."></app-dynamic>

Also, you can use context for binding. Context has a higher priority than the inputs in the component.

<ng-container *ngxComponentOutlet="component; context { item: '' }"></ng-container>

If you still need to access a dynamic component, then use ngxComponentOutletActivated output.

<ng-template
  [ngxComponentOutlet]="component"
  (ngxComponentOutletActivate)="onActivate($event)"
></ng-template>

[thekiba]

I will close this issue. If you have any questions, then create a new one.