import { Component , ComponentFactoryResolver , ComponentRef , EventEmitter , Input , OnDestroy , OnInit , Output , ViewChild , ViewContainerRef } from '@angular/core' ; import { configComponents } from './configs.list' ; import { CmdbType } from '../../../models/cmdb-type' ; import { CmdbMode } from '../../../modes.enum' ; import { FormGroup } from '@angular/forms' ; import { ConfigEditBaseComponent } from './config.edit' ; import { ReplaySubject } from 'rxjs' ; @ Component ( { selector : 'cmdb-config-edit' , templateUrl : './config-edit.component.html' , styleUrls : [ './config-edit.component.scss' ] } ) export class ConfigEditComponent implements OnInit , OnDestroy { public modes : typeof CmdbMode = CmdbMode ; private subscriber : ReplaySubject < void > = new ReplaySubject < void > ( ) ; public form : FormGroup ; @ Input ( ) public mode : CmdbMode = CmdbMode . Create ; @ Input ( ) public data : any ; @ Input ( ) public fields : Array < any > = [ ] ; @ Input ( ) public sections : Array < any > = [ ] ; @ Input ( ) public types : Array < CmdbType > = [ ] ; @ ViewChild ( 'configContainer' , { read : ViewContainerRef , static : true } ) container ; private component : any ; private componentRef : ComponentRef < any > ; constructor ( private resolver ) { this . form = new FormGroup ( { } ) ; } public ngOnInit ( ) { this . container . clear ( ) ; this . component = configComponents [ this . data . type ] ; const factory = this . resolver . resolveComponentFactory < ConfigEditBaseComponent > ( this . component ) ; this . componentRef = this . container . createComponent ( factory ) ; this . componentRef . instance . mode = this . mode ; this . componentRef . instance . data = this . data ; this . componentRef . instance . form = this . form ; this . componentRef . instance . sections = this . sections ; this . componentRef . instance . fields = this . fields ; } public ngOnDestroy ( ) { this . subscriber . next ( ) ; this . subscriber . complete ( ) ; } }