diff --git a/packages/angular/src/components/ion-nav.ts b/packages/angular/src/components/ion-nav.ts index 0edd0b130b..749ee679dd 100644 --- a/packages/angular/src/components/ion-nav.ts +++ b/packages/angular/src/components/ion-nav.ts @@ -23,7 +23,7 @@ export class IonNavDelegate implements FrameworkDelegate { attachViewToDom(elementOrContainerToMountTo: HTMLIonNavElement, elementOrComponentToMount: Type, _propsOrDataObj?: any, classesToAdd?: string[]): Promise { // wrap whatever the user provides in an ion-page - return this.angularComponentMounter.attachViewToDom(elementOrContainerToMountTo, null, elementOrComponentToMount, this.componentResolveFactory, this.injector, _propsOrDataObj, classesToAdd, true); + return this.angularComponentMounter.attachViewToDom(elementOrContainerToMountTo, null, elementOrComponentToMount, this.componentResolveFactory, this.injector, _propsOrDataObj, classesToAdd); } removeViewFromDom(parentElement: HTMLElement, childElement: HTMLElement) { diff --git a/packages/angular/src/providers/angular-component-mounter.ts b/packages/angular/src/providers/angular-component-mounter.ts index 8b2de049c1..ad72908776 100644 --- a/packages/angular/src/providers/angular-component-mounter.ts +++ b/packages/angular/src/providers/angular-component-mounter.ts @@ -19,14 +19,14 @@ export class AngularComponentMounter { constructor(private defaultCfr: ComponentFactoryResolver, private zone: NgZone, private appRef: ApplicationRef) { } - attachViewToDom(parentElement: HTMLElement, hostElement: HTMLElement, componentToMount: Type, componentResolveFactory: ComponentFactoryResolver, injector: Injector, data: any, classesToAdd: string[], wrapUserComponentInIonPage: boolean): Promise { + attachViewToDom(parentElement: HTMLElement, hostElement: HTMLElement, componentToMount: Type, componentResolveFactory: ComponentFactoryResolver, injector: Injector, data: any, classesToAdd: string[]): Promise { return new Promise((resolve) => { this.zone.run(() => { const crf = componentResolveFactory ? componentResolveFactory : this.defaultCfr; - const mountingData = attachViewToDom(crf, parentElement, hostElement, componentToMount, injector, this.appRef, data, classesToAdd, wrapUserComponentInIonPage); + const mountingData = attachViewToDom(crf, parentElement, hostElement, componentToMount, injector, this.appRef, data, classesToAdd); resolve(mountingData); }); }); @@ -43,18 +43,14 @@ export class AngularComponentMounter { } -export function removeViewFromDom(parentElement: HTMLElement, childElement: HTMLElement) { +export function removeViewFromDom(_parentElement: HTMLElement, childElement: HTMLElement) { const mountingData = elementToComponentRefMap.get(childElement); if (mountingData) { - const componentParent = mountingData.element.parentNode; mountingData.componentRef.destroy(); - if (mountingData.wrapUserComponentInIonPage && parentElement.contains(componentParent) ) { - parentElement.removeChild(componentParent) - } } } -export function attachViewToDom(crf: ComponentFactoryResolver, parentElement: HTMLElement, hostElement: HTMLElement, componentToMount: Type, injector: Injector, appRef: ApplicationRef, data: any, classesToAdd: string[], wrapUserComponentInIonPage: boolean): AngularMountingData { +export function attachViewToDom(crf: ComponentFactoryResolver, parentElement: HTMLElement, hostElement: HTMLElement, componentToMount: Type, injector: Injector, appRef: ApplicationRef, data: any, classesToAdd: string[]): AngularMountingData { const componentProviders = ReflectiveInjector.resolve(getProviders(parentElement, data)); const componentFactory = crf.resolveComponentFactory(componentToMount); @@ -68,8 +64,7 @@ export function attachViewToDom(crf: ComponentFactoryResolver, parentElement: HT hostElement.classList.add(clazz); } - const elementToAppend = wrapUserComponentInIonPage ? getIonPageElement(hostElement) : hostElement; - parentElement.appendChild(elementToAppend); + parentElement.appendChild(hostElement); appRef.attachView(componentRef.hostView); @@ -80,16 +75,9 @@ export function attachViewToDom(crf: ComponentFactoryResolver, parentElement: HT instance: componentRef.instance, angularHostElement: componentRef.location.nativeElement, element: hostElement, - wrapUserComponentInIonPage }; elementToComponentRefMap.set(hostElement, mountingData); return mountingData; } - -export function getIonPageElement(hostElement: HTMLElement) { - const page = document.createElement('ion-page'); - page.appendChild(hostElement); - return page; -} \ No newline at end of file diff --git a/packages/angular/src/providers/modal-controller.ts b/packages/angular/src/providers/modal-controller.ts index f6d5bfe3c9..016e88d1ea 100644 --- a/packages/angular/src/providers/modal-controller.ts +++ b/packages/angular/src/providers/modal-controller.ts @@ -38,7 +38,7 @@ export class ModalController implements FrameworkDelegate { attachViewToDom(elementOrContainerToMountTo: HTMLElement, elementOrComponentToMount: Type, _propsOrDataObj?: any, classesToAdd?: string[]): Promise { - return this.angularComponentMounter.attachViewToDom(elementOrContainerToMountTo, null, elementOrComponentToMount, this.componentResolveFactory, this.injector, _propsOrDataObj, classesToAdd, true); + return this.angularComponentMounter.attachViewToDom(elementOrContainerToMountTo, null, elementOrComponentToMount, this.componentResolveFactory, this.injector, _propsOrDataObj, classesToAdd); } removeViewFromDom(parentElement: HTMLElement, childElement: HTMLElement) { diff --git a/packages/angular/src/providers/popover-controller.ts b/packages/angular/src/providers/popover-controller.ts index cef8ea3f6a..01c653efff 100644 --- a/packages/angular/src/providers/popover-controller.ts +++ b/packages/angular/src/providers/popover-controller.ts @@ -31,7 +31,7 @@ export class PopoverController implements FrameworkDelegate { attachViewToDom(elementOrContainerToMountTo: HTMLElement, elementOrComponentToMount: Type, _propsOrDataObj?: any, classesToAdd?: string[]): Promise { - return this.angularComponentMounter.attachViewToDom(elementOrContainerToMountTo, null, elementOrComponentToMount, this.componentResolveFactory, this.injector, _propsOrDataObj, classesToAdd, false); + return this.angularComponentMounter.attachViewToDom(elementOrContainerToMountTo, null, elementOrComponentToMount, this.componentResolveFactory, this.injector, _propsOrDataObj, classesToAdd); } removeViewFromDom(parentElement: HTMLElement, childElement: HTMLElement) { diff --git a/packages/angular/src/types/interfaces.ts b/packages/angular/src/types/interfaces.ts index afb521b01c..1b4d4acfaa 100644 --- a/packages/angular/src/types/interfaces.ts +++ b/packages/angular/src/types/interfaces.ts @@ -12,5 +12,4 @@ export interface AngularMountingData extends FrameworkMountingData { componentRef?: ComponentRef; instance?: any; angularHostElement?: HTMLElement; - wrapUserComponentInIonPage?: boolean; }