Dynamic Modals (#417)

* Move backdrop and click handler to modal service since they should not be used in web

* Add support for opening modals using ViewContainerRef

angular/src/components/modal/dynamic-modal.component.ts

@@ -0,0 +1,57 @@
+import {
+    AfterViewInit,
+    ChangeDetectorRef,
+    Component,
+    ComponentFactoryResolver,
+    ComponentRef,
+    ElementRef,
+    OnDestroy,
+    Type,
+    ViewChild,
+    ViewContainerRef
+} from '@angular/core';
+
+import { ModalRef } from './modal.ref';
+
+@Component({
+    selector: 'app-modal',
+    template: '<ng-template #modalContent></ng-template>',
+})
+export class DynamicModalComponent implements AfterViewInit, OnDestroy {
+    componentRef: ComponentRef<any>;
+
+    @ViewChild('modalContent', { read: ViewContainerRef, static: true }) modalContentRef: ViewContainerRef;
+
+    childComponentType: Type<any>;
+    setComponentParameters: (component: any) => void;
+
+    constructor(private componentFactoryResolver: ComponentFactoryResolver, private cd: ChangeDetectorRef,
+        private el: ElementRef<HTMLElement>, public modalRef: ModalRef) {}
+
+    ngAfterViewInit() {
+        this.loadChildComponent(this.childComponentType);
+        if (this.setComponentParameters != null) {
+            this.setComponentParameters(this.componentRef.instance);
+        }
+        this.cd.detectChanges();
+
+        this.modalRef.created(this.el.nativeElement);
+    }
+
+    loadChildComponent(componentType: Type<any>) {
+        const componentFactory = this.componentFactoryResolver.resolveComponentFactory(componentType);
+
+        this.modalContentRef.clear();
+        this.componentRef = this.modalContentRef.createComponent(componentFactory);
+    }
+
+    ngOnDestroy() {
+        if (this.componentRef) {
+            this.componentRef.destroy();
+        }
+    }
+
+    close() {
+        this.modalRef.close();
+    }
+}