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

fix(angular): change detection

Browse Source
This commit is contained in:
Manu Mtz.-Almeida
2018-04-06 16:19:32 +02:00
parent a3cd5db3a7
commit 79ba6391d6
6 changed files with 60 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
angular/src/directives/navigation/ion-back-button.ts
View File

@ -1,7 +1,7 @@
import { Directive, ElementRef, HostListener, Input, Optional } from '@angular/core';
import { IonRouterOutlet } from './ion-router-outlet';
import { Router } from '@angular/router';
import { NavController } from '../..';
import { NavController } from '../../providers/nav-controller';
import { IonRouterOutlet } from './ion-router-outlet';
@Directive({
selector: 'ion-back-button'

4
angular/src/directives/proxies.ts
View File

@ -2,7 +2,7 @@
import { Directive as NgDirective, ElementRef, EventEmitter as NgEventEmitter, Input as NgInput, Output as NgOutput } from '@angular/core';
export function method(ref: ElementRef, methodName: string, ...args: any[]) {
export function method(ref: ElementRef, methodName: string, args: any[]) {
return ref.nativeElement.componentOnReady()
.then((el: any) => el[methodName].apply(el, args));
}
@ -907,8 +907,6 @@ export class Menu {
@NgInput() maxEdgeStart: number;
@NgOutput() ionOpen: NgEventEmitter<any>;
@NgOutput() ionClose: NgEventEmitter<any>;
@NgOutput() ionMenuDidLoad: NgEventEmitter<any>;
@NgOutput() ionMenuDidUnload: NgEventEmitter<any>;
@NgOutput() ionMenuChange: NgEventEmitter<any>;
isOpen(...__args: any[]): Promise<any> {
return method(this.r, isOpen, __args);

86
angular/src/providers/angular-delegate.ts
View File

@ -1,10 +1,4 @@
import {
ApplicationRef,
ComponentFactoryResolver,
Injectable,
Injector,
} from '@angular/core';
import { ApplicationRef, ComponentFactoryResolver, Injectable, Injector, NgZone } from '@angular/core';
import { FrameworkDelegate, ViewLifecycle } from '@ionic/core';
@ -12,11 +6,12 @@ import { FrameworkDelegate, ViewLifecycle } from '@ionic/core';
export class AngularDelegate {
constructor(
private appRef: ApplicationRef
private appRef: ApplicationRef,
private zone: NgZone
) {}
create(cfr: ComponentFactoryResolver, injector: Injector) {
return new AngularFrameworkDelegate(cfr, injector, this.appRef);
return new AngularFrameworkDelegate(cfr, injector, this.appRef, this.zone);
}
}
@ -28,40 +23,61 @@ export class AngularFrameworkDelegate implements FrameworkDelegate {
constructor(
private cfr: ComponentFactoryResolver,
private injector: Injector,
private appRef: ApplicationRef
private appRef: ApplicationRef,
private zone: NgZone,
) {}
attachViewToDom(container: any, component: any, data?: any, cssClasses?: string[]): Promise<any> {
const componentFactory = this.cfr.resolveComponentFactory(component);
const hostElement = document.createElement(componentFactory.selector);
if (data) {
Object.assign(hostElement, data);
}
const childInjector = Injector.create([], this.injector);
const componentRef = componentFactory.create(childInjector, [], hostElement);
for (const clazz of cssClasses) {
hostElement.classList.add(clazz);
}
bindLifecycleEvents(componentRef.instance, hostElement);
container.appendChild(hostElement);
this.appRef.attachView(componentRef.hostView);
this.elRefMap.set(hostElement, componentRef);
return Promise.resolve(hostElement);
attachViewToDom(container: any, component: any, params?: any, cssClasses?: string[]): Promise<any> {
return new Promise(resolve => {
this.zone.run(() => {
const el = attachView(
this.cfr, this.injector, this.appRef, this.elRefMap,
container, component, params, cssClasses
);
resolve(el);
});
});
}
removeViewFromDom(_container: any, component: any): Promise<void> {
const componentRef = this.elRefMap.get(component);
if (componentRef) {
componentRef.destroy();
this.elRefMap.delete(component);
}
return Promise.resolve();
return new Promise(resolve => {
this.zone.run(() => {
const componentRef = this.elRefMap.get(component);
if (componentRef) {
componentRef.destroy();
this.elRefMap.delete(component);
}
resolve();
});
});
}
}
export function attachView(
cfr: ComponentFactoryResolver,
injector: Injector,
appRef: ApplicationRef,
elRefMap: WeakMap<HTMLElement, any>,
container: any, component: any, data?: any, cssClasses?: string[]) {
const componentFactory = cfr.resolveComponentFactory(component);
const hostElement = document.createElement(componentFactory.selector);
if (data) {
Object.assign(hostElement, data);
}
const childInjector = Injector.create([], injector);
const componentRef = componentFactory.create(childInjector, [], hostElement);
for (const clazz of cssClasses) {
hostElement.classList.add(clazz);
}
bindLifecycleEvents(componentRef.instance, hostElement);
container.appendChild(hostElement);
appRef.attachView(componentRef.hostView);
elRefMap.set(hostElement, componentRef);
return hostElement;
}
const LIFECYCLES = [
ViewLifecycle.WillEnter,
ViewLifecycle.DidEnter,