javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-10 00:27:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(overlays): page is removed properly

Browse Source
This commit is contained in:
Manu Mtz.-Almeida
2018-03-20 19:12:22 +01:00
parent 769282935b
commit 9988c754ac
5 changed files with 20 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
core/src/components/input-shims/hacks/common.ts
View File

@ -40,7 +40,7 @@ function removeClone(componentEl: HTMLElement, inputEl: HTMLElement) {
if (componentEl && componentEl.parentElement) {
const clonedInputEles = componentEl.parentElement.querySelectorAll('.cloned-input');
for (let i = 0; i < clonedInputEles.length; i++) {
clonedInputEles[i].parentNode.removeChild(clonedInputEles[i]);
clonedInputEles[i].remove();
}
componentEl.style.pointerEvents = '';
}

5
core/src/components/modal/modal.tsx
View File

@ -2,7 +2,7 @@ import { Component, Element, Event, EventEmitter, Listen, Method, Prop } from '@
import { Animation, AnimationBuilder, Config, FrameworkDelegate } from '../../index';
import { createThemedClasses, getClassMap } from '../../utils/theme';
import { BACKDROP, OverlayEventDetail, OverlayInterface, attachComponent, dismiss, eventMethod, present } from '../../utils/overlays';
import { BACKDROP, OverlayEventDetail, OverlayInterface, attachComponent, detachComponent, dismiss, eventMethod, present } from '../../utils/overlays';
import iosEnterAnimation from './animations/ios.enter';
import iosLeaveAnimation from './animations/ios.leave';
@ -186,7 +186,8 @@ export class Modal implements OverlayInterface {
*/
@Method()
dismiss(data?: any, role?: string): Promise<void> {
return dismiss(this, data, role, 'modalLeave', iosLeaveAnimation, mdLeaveAnimation);
return dismiss(this, data, role, 'modalLeave', iosLeaveAnimation, mdLeaveAnimation)
.then(() => detachComponent(this.delegate, this.usersElement));
}
/**

5
core/src/components/popover/popover.tsx
View File

@ -2,7 +2,7 @@ import { Component, Element, Event, EventEmitter, Listen, Method, Prop } from '@
import { Animation, AnimationBuilder, Config, FrameworkDelegate } from '../../index';
import { createThemedClasses, getClassMap } from '../../utils/theme';
import { BACKDROP, OverlayEventDetail, OverlayInterface, attachComponent, dismiss, eventMethod, present } from '../../utils/overlays';
import { BACKDROP, OverlayEventDetail, OverlayInterface, attachComponent, detachComponent, dismiss, eventMethod, present } from '../../utils/overlays';
import iosEnterAnimation from './animations/ios.enter';
import iosLeaveAnimation from './animations/ios.leave';
@ -196,7 +196,8 @@ export class Popover implements OverlayInterface {
*/
@Method()
dismiss(data?: any, role?: string): Promise<void> {
return dismiss(this, data, role, 'popoverLeave', iosLeaveAnimation, mdLeaveAnimation, this.ev);
return dismiss(this, data, role, 'popoverLeave', iosLeaveAnimation, mdLeaveAnimation, this.ev)
.then(() => detachComponent(this.delegate, this.usersElement));
}
/**

2
core/src/components/ripple-effect/ripple-effect.tsx
View File

@ -82,7 +82,7 @@ export class RippleEffect {
style.animationDuration = duration + 'ms';
this.el.appendChild(div);
setTimeout(() => this.el.removeChild(div), duration + 50);
setTimeout(() => div.remove(), duration + 50);
});
}
}

15
core/src/utils/overlays.ts
View File

@ -98,9 +98,7 @@ export function dismiss(
return overlayAnimation(overlay, animationBuilder, overlay.el, opts).then(() => {
overlay.didDismiss.emit({data, role});
if (overlay.el.parentNode) {
overlay.el.parentNode.removeChild(overlay.el);
}
overlay.el.remove();
});
}
@ -154,6 +152,17 @@ export function attachComponent(delegate: FrameworkDelegate, container: Element,
return Promise.resolve(el);
}
export function detachComponent(delegate: FrameworkDelegate, element: HTMLElement) {
if (element) {
if (delegate) {
const container = element.parentElement;
return delegate.removeViewFromDom(container, element);
}
element.remove();
}
return Promise.resolve();
}
export function eventMethod<T>(element: HTMLElement, eventName: string, callback?: (detail: T) => void): Promise<T> {
let resolve: Function;
const promise = new Promise<T>(r => resolve = r);