Tutorial by Examples

A custom component that takes the type of a component as input and creates an instance of that component type inside itself. When the input is updated, the previously added dynamic component is removed and the new one added instead. @Component({ selector: 'dcl-wrapper', template: `<div #...

Main Component File: //our root app component import {Component, NgModule, ViewChild, ViewContainerRef, ComponentFactoryResolver, ComponentRef} from '@angular/core' import {BrowserModule} from '@angular/platform-browser' import {ChildComponent} from './childComp.ts' @Component({ selector: ...

We can create dynamic component and get the instances of component into an array and finally rendered it on template. For example, we can can consider two widget component, ChartWidget and PatientWidget which extended the class WidgetComponent that I wanted to add in the container. ChartWidget.ts ...