javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-21 04:53:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(modal): make sure content is ready

Browse Source 
fixes #14969
This commit is contained in:
Manu Mtz.-Almeida
2018-08-25 16:48:30 +02:00
parent 3ffa3cd7db
commit 2c8bc0433b
3 changed files with 12 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -4,6 +4,7 @@ import { Animation, AnimationBuilder, ComponentProps, ComponentRef, Config, Fram
import { attachComponent, detachComponent } from '../../utils/framework-delegate'; import { attachComponent, detachComponent } from '../../utils/framework-delegate';
import { BACKDROP, dismiss, eventMethod, present } from '../../utils/overlays'; import { BACKDROP, dismiss, eventMethod, present } from '../../utils/overlays';
import { createThemedClasses, getClassMap } from '../../utils/theme'; import { createThemedClasses, getClassMap } from '../../utils/theme';
import { deepReady } from '../../utils/transition';
import { iosEnterAnimation } from './animations/ios.enter'; import { iosEnterAnimation } from './animations/ios.enter';
import { iosLeaveAnimation } from './animations/ios.leave'; import { iosLeaveAnimation } from './animations/ios.leave';
@ -134,12 +135,12 @@ export class Modal implements OverlayInterface {
const el = this.usersElement; const el = this.usersElement;
const name = LIFECYCLE_MAP[modalEvent.type]; const name = LIFECYCLE_MAP[modalEvent.type];
if (el && name) { if (el && name) {
const event = new CustomEvent(name, { const ev = new CustomEvent(name, {
bubbles: false, bubbles: false,
cancelable: false, cancelable: false,
detail: modalEvent.detail detail: modalEvent.detail
}); });
el.dispatchEvent(event); el.dispatchEvent(ev);
} }
} }
@ -160,6 +161,7 @@ export class Modal implements OverlayInterface {
modal: this.el modal: this.el
}; };
this.usersElement = await attachComponent(this.delegate, container, this.component, ['ion-page'], componentProps); this.usersElement = await attachComponent(this.delegate, container, this.component, ['ion-page'], componentProps);
await deepReady(this.usersElement);
return present(this, 'modalEnter', iosEnterAnimation, mdEnterAnimation); return present(this, 'modalEnter', iosEnterAnimation, mdEnterAnimation);
} }

8
core/src/utils/framework-delegate.ts
View File

@ -1,6 +1,12 @@
import { ComponentRef, FrameworkDelegate } from '../interface'; import { ComponentRef, FrameworkDelegate } from '../interface';
export async function attachComponent(delegate: FrameworkDelegate | undefined, container: Element, component: ComponentRef, cssClasses?: string[], componentProps?: {[key: string]: any}): Promise<HTMLElement> { export async function attachComponent(
delegate: FrameworkDelegate | undefined,
container: Element,
component: ComponentRef,
cssClasses?: string[],
componentProps?: {[key: string]: any}
): Promise<HTMLElement> {
if (delegate) { if (delegate) {
return delegate.attachViewToDom(container, component, componentProps, cssClasses); return delegate.attachViewToDom(container, component, componentProps, cssClasses);
} }

2
core/src/utils/transition.ts
View File

@ -174,7 +174,7 @@ function shallowReady(el: Element | undefined): Promise<any> {
return Promise.resolve(); return Promise.resolve();
} }
async function deepReady(el: Element | undefined): Promise<void> { export async function deepReady(el: Element | undefined): Promise<void> {
const element = el as HTMLStencilElement; const element = el as HTMLStencilElement;
if (element) { if (element) {
if (element.componentOnReady) { if (element.componentOnReady) {