Angular 2 append Component dynamic to DOM or template

Question

I\'m planning to add a component dynamic to the DOM if show() is called. I know there is a solution with ngIf or [hidden] to hide it and use it as a directive, but I\'m not

Answer 1

UPDATE

Use ViewContainerRef.createComponent()

• https://angular.io/guide/dynamic-component-loader
• https://angular.io/api/core/ViewContainerRef#createComponent

For a full example see Angular dynamic tabs with user-click chosen components

ORIGINAL

DynamicComponentLoader was removed long ago

You can use DynamicComponentLoader for this purpose, but it's a bit cumbersome and has some issues related to bindings.

See also:

• http://www.syntaxsuccess.com/viewarticle/loading-components-dynamically-in-angular-2.0
• DynamicComponentLoader breaks Data binding
• DynamicComponentLoader does not support inputs or outputs
• Initial Changedetection not working with DynamicComponentLoader
• Angular2: Two-way data binding on component dynamically inserted using DynamicComponentLoader
• How to provide data to a @Component through DynamicComponentLoader?
• Angular2: Creating child components programmatically