1 files changed, 107 insertions, 0 deletions
diff --git a/vid-webpack-master/src/app/shared/components/customModal/services/create-dynamic-component.service.ts b/vid-webpack-master/src/app/shared/components/customModal/services/create-dynamic-component.service.ts
new file mode 100644
index 000000000..64fe66ce6
--- /dev/null
+++ b/vid-webpack-master/src/app/shared/components/customModal/services/create-dynamic-component.service.ts
@@ -0,0 +1,107 @@
+import {
+  ApplicationRef,
+  ComponentFactoryResolver,
+  ComponentRef,
+  EmbeddedViewRef,
+  Injectable,
+  Injector, Type, ViewContainerRef
+} from "@angular/core";
+
+@Injectable()
+export class CreateDynamicComponentService {
+
+  constructor(private componentFactoryResolver: ComponentFactoryResolver,
+              private applicationRef: ApplicationRef,
+              private injector: Injector) {
+  }
+
+  /**
+   * Gets the root view container to inject the component to.
+   *
+   * @returns {ComponentRef<any>}
+   *
+   * @memberOf InjectionService
+   */
+  private getRootViewContainer(): ComponentRef<any> {
+    const rootComponents = this.applicationRef['components'];
+    if (rootComponents.length) {
+      return rootComponents[0];
+    }
+    throw new Error('View Container not found! ngUpgrade needs to manually set this via setRootViewContainer.');
+  }
+
+  /**
+   * Gets the html element for a component ref.
+   *
+   * @param {ComponentRef<any>} componentRef
+   * @returns {HTMLElement}
+   *
+   * @memberOf InjectionService
+   */
+  private getComponentRootNode(componentRef: ComponentRef<any>): HTMLElement {
+    return (componentRef.hostView as EmbeddedViewRef<any>).rootNodes[0] as HTMLElement;
+  }
+
+  /**
+   * Gets the root component container html element.
+   *
+   * @returns {HTMLElement}
+   *
+   * @memberOf InjectionService
+   */
+  private getRootViewContainerNode(): HTMLElement {
+    return this.getComponentRootNode(this.getRootViewContainer());
+  }
+
+  /**
+   * Projects the inputs onto the component
+   *
+   * @param {ComponentRef<any>} component
+   * @param {*} options
+   * @returns {ComponentRef<any>}
+   *
+   * @memberOf InjectionService
+   */
+  private projectComponentInputs(component: ComponentRef<any>, options: any): ComponentRef<any> {
+    if (options) {
+      const props = Object.getOwnPropertyNames(options);
+      for (const prop of props) {
+        component.instance[prop] = options[prop];
+      }
+    }
+
+    return component;
+  }
+
+  public createComponentDynamically<T>(componentClass: Type<T>, options: any = {}, location: Element = this.getRootViewContainerNode()): ComponentRef<any> {
+    const componentFactory = this.componentFactoryResolver.resolveComponentFactory(componentClass);
+    const componentRef = componentFactory.create(this.injector);
+    const componentRootNode = this.getComponentRootNode(componentRef);
+
+    // project the options passed to the component instance
+    this.projectComponentInputs(componentRef, options);
+    this.applicationRef.attachView(componentRef.hostView);
+
+    componentRef.onDestroy(() => {
+      this.applicationRef.detachView(componentRef.hostView);
+    });
+
+    location.appendChild(componentRootNode);
+    return componentRef;
+  }
+
+  /**
+   * Inserts a component into an existing viewContainer
+   * @param componentType - type of component to create
+   * @param options - Inputs to project on new component
+   * @param vcRef - viewContainerRef in which to insert the newly created component
+   */
+  public insertComponentDynamically<T>(componentType: Type<T>, options: any = {}, vcRef: ViewContainerRef): ComponentRef<any> {
+    const factory = this.componentFactoryResolver.resolveComponentFactory(componentType);
+    const dynamicComponent = factory.create(vcRef.parentInjector);
+    this.projectComponentInputs(dynamicComponent, options);
+    vcRef.insert(dynamicComponent.hostView);
+    return dynamicComponent;
+  }
+
+}