ngx-dynamic-component-loader v1.2.0

NgxDynamicComponentLoaderLib

Library for loader your component from controller, service, etc...

Install 👷🏼

npm install ngx-dynamic-component-loader --save

Examples 👯‍

Here

Usage 🧙

1. Add Module

  @NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    NgxDynamicComponentLoaderModule
  ],
  entryComponents: [SampleComponent],
  providers: [],
  bootstrap: [AppComponent]
})

**Don't forguet to add your Dynamic Components in entryComponents**

2. You can use in your component

  constructor(private dynamicComponentLoaderService: NgxDynamicComponentLoaderService) {

  }


  loadComponent(){
    const component = SampleComponent;
    const params = {} // params for initialize this component.

    this.loaderComponentService.getComponent(component, params).then((val: DynamicComponent) => {
      document.appendChild(val.componentView); // you have the DOM element and you can append in anywhere
    })
  }

DynamicComponent Model 🕵🏼

Result when your get the component.

DynamicComponent {
  componentRef: ComponentRef<any>; // --> Component Reference
  componentView: any; // --> DOM Reference
  destroy() // --> Destroy the element from DOM and Ref.
}

Author

Alex Marcos Gutierrez

License

MIT