summaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/ng2/services/modal.service.ts
diff options
context:
space:
mode:
authorMichael Lando <ml636r@att.com>2018-03-04 14:53:33 +0200
committerMichael Lando <ml636r@att.com>2018-03-07 13:19:05 +0000
commita5445100050e49e83f73424198d73cd72d672a4d (patch)
treecacf4df817df31be23e4e790d1dda857bdae061e /catalog-ui/src/app/ng2/services/modal.service.ts
parent51157f92c21976cba4914c378aaa3cba49826931 (diff)
Sync Integ to Master
Change-Id: I71e3acc26fa612127756ac04073a522b9cc6cd74 Issue-ID: SDC-977 Signed-off-by: Gitelman, Tal (tg851x) <tg851x@intl.att.com>
Diffstat (limited to 'catalog-ui/src/app/ng2/services/modal.service.ts')
-rw-r--r--catalog-ui/src/app/ng2/services/modal.service.ts37
1 files changed, 14 insertions, 23 deletions
diff --git a/catalog-ui/src/app/ng2/services/modal.service.ts b/catalog-ui/src/app/ng2/services/modal.service.ts
index 22b56c7004..4e86d6accf 100644
--- a/catalog-ui/src/app/ng2/services/modal.service.ts
+++ b/catalog-ui/src/app/ng2/services/modal.service.ts
@@ -1,11 +1,12 @@
import {
Injectable, Type, ViewContainerRef, ApplicationRef, ComponentFactory, ComponentFactoryResolver, ComponentRef,
-
+ TemplateRef
} from '@angular/core';
import { ModalModel, ButtonModel, StepModel } from 'app/models';
import {MultiStepsWizardComponent} from "../components/ui/multi-steps-wizard/multi-steps-wizard.component";
import {ModalComponent} from "../components/ui/modal/modal.component";
import {WizardHeaderBaseComponent} from "app/ng2/components/ui/multi-steps-wizard/multi-steps-wizard-header-base.component";
+import { DynamicComponentService } from 'app/ng2/services/dynamic-component.service';
@Injectable()
@@ -13,7 +14,7 @@ export class ModalService {
currentModal: ComponentRef<any>;
- constructor(private componentFactoryResolver: ComponentFactoryResolver, private applicationRef: ApplicationRef) { }
+ constructor(private dynamicComponentService: DynamicComponentService) { }
/* Shortcut method to open an alert modal with title, message, and close button that simply closes the modal. */
@@ -52,7 +53,7 @@ export class ModalService {
/* Use this method to create a modal with title, message, and completely custom buttons. Use response.instance.open() to open */
public createCustomModal = (customModalData: ModalModel): ComponentRef<ModalComponent> => {
- let customModal: ComponentRef<ModalComponent> = this.createDynamicComponent(ModalComponent);
+ let customModal: ComponentRef<ModalComponent> = this.dynamicComponentService.createDynamicComponent(ModalComponent);
customModal.instance.input = customModalData;
this.currentModal = customModal;
@@ -62,12 +63,12 @@ export class ModalService {
public createMultiStepsWizard = (title: string, steps:Array<StepModel>, callback: Function, dynamicHeaderType?: Type<WizardHeaderBaseComponent>): ComponentRef<MultiStepsWizardComponent> => {
let cancelButton: ButtonModel = new ButtonModel('Cancel', 'outline blue', this.closeCurrentModal);
let modalModel: ModalModel = new ModalModel('xl', title, '', [cancelButton]);
- let wizardInstance: ComponentRef<MultiStepsWizardComponent> = this.createDynamicComponent(MultiStepsWizardComponent);
+ let wizardInstance: ComponentRef<MultiStepsWizardComponent> = this.dynamicComponentService.createDynamicComponent(MultiStepsWizardComponent);
wizardInstance.instance.input = modalModel;
wizardInstance.instance.steps = steps;
wizardInstance.instance.callback = callback;
if(dynamicHeaderType){
- let dynamicHeader = this.createDynamicComponent(dynamicHeaderType, wizardInstance.instance.dynamicHeaderContainer);
+ let dynamicHeader = this.dynamicComponentService.createDynamicComponent(dynamicHeaderType, wizardInstance.instance.dynamicHeaderContainer);
wizardInstance.instance.dynamicHeader = dynamicHeader;
wizardInstance.instance.dynamicHeader.instance.currentStepIndex = 0;
}
@@ -76,38 +77,28 @@ export class ModalService {
return wizardInstance;
}
-
+
public closeCurrentModal = () => {
if (!this.currentModal) return;
this.currentModal.instance.close();
this.currentModal.destroy();
+ delete this.currentModal;
}
public addDynamicContentToModal = (modalInstance: ComponentRef<ModalComponent>, dynamicComponentType: Type<any>, dynamicComponentInput?: any) => {
- let dynamicContent = this.createDynamicComponent(dynamicComponentType, modalInstance.instance.dynamicContentContainer);
+ let dynamicContent = this.dynamicComponentService.createDynamicComponent(dynamicComponentType, modalInstance.instance.dynamicContentContainer);
dynamicContent.instance.input = dynamicComponentInput;
modalInstance.instance.dynamicContent = dynamicContent;
return modalInstance;
}
- //Creates a component dynamically (aka during runtime). If a view container is not specified, it will append the new component to the app root.
- //To subscribe to an event from invoking component: componentRef.instance.clicked.subscribe((m) => console.log(m.name));
- private createDynamicComponent<T>(componentType: Type<T>, viewContainerRef?:ViewContainerRef): ComponentRef<T> {
-
- viewContainerRef = viewContainerRef || this.getRootViewContainerRef();
- viewContainerRef.clear();
+ public addDynamicTemplateToModal = (modalInstance: ComponentRef<ModalComponent>, templateRef: TemplateRef<void>) => {
+ modalInstance.instance.dynamicContentContainer.clear();
+ modalInstance.instance.dynamicContentContainer.createEmbeddedView(templateRef);
+ return modalInstance;
+ };
- let factory: ComponentFactory<T> = this.componentFactoryResolver.resolveComponentFactory(componentType); //Ref: https://angular.io/guide/dynamic-component-loader
- let componentRef: ComponentRef<T> = viewContainerRef.createComponent(factory);
- return componentRef;
- }
-
- private getRootViewContainerRef(): ViewContainerRef {
- return this.applicationRef.components[0].instance.viewContainerRef;
- }
}
-
-