mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 11:17:19 +08:00
fix(angular): viewContainer in overlays
This commit is contained in:
@ -1,4 +1,4 @@
|
||||
import { ComponentFactoryResolver, Injectable, InjectionToken, Injector, NgZone, ViewContainerRef } from '@angular/core';
|
||||
import { ApplicationRef, ComponentFactoryResolver, Injectable, InjectionToken, Injector, NgZone, ViewContainerRef } from '@angular/core';
|
||||
import { FrameworkDelegate, ViewLifecycle } from '@ionic/core';
|
||||
import { NavParams } from '../directives/navigation/nav-params';
|
||||
|
||||
@ -7,15 +7,16 @@ import { NavParams } from '../directives/navigation/nav-params';
|
||||
export class AngularDelegate {
|
||||
|
||||
constructor(
|
||||
private zone: NgZone
|
||||
private zone: NgZone,
|
||||
private appRef: ApplicationRef
|
||||
) {}
|
||||
|
||||
create(
|
||||
resolver: ComponentFactoryResolver,
|
||||
injector: Injector,
|
||||
location: ViewContainerRef,
|
||||
location?: ViewContainerRef,
|
||||
) {
|
||||
return new AngularFrameworkDelegate(resolver, injector, location, this.zone);
|
||||
return new AngularFrameworkDelegate(resolver, injector, location, this.appRef, this.zone);
|
||||
}
|
||||
}
|
||||
|
||||
@ -28,6 +29,7 @@ export class AngularFrameworkDelegate implements FrameworkDelegate {
|
||||
private resolver: ComponentFactoryResolver,
|
||||
private injector: Injector,
|
||||
private location: ViewContainerRef,
|
||||
private appRef: ApplicationRef,
|
||||
private zone: NgZone,
|
||||
) {}
|
||||
|
||||
@ -35,7 +37,7 @@ export class AngularFrameworkDelegate implements FrameworkDelegate {
|
||||
return new Promise(resolve => {
|
||||
this.zone.run(() => {
|
||||
const el = attachView(
|
||||
this.resolver, this.injector, this.location, this.elRefMap,
|
||||
this.resolver, this.injector, this.location, this.appRef, this.elRefMap,
|
||||
container, component, params, cssClasses
|
||||
);
|
||||
resolve(el);
|
||||
@ -60,12 +62,17 @@ export class AngularFrameworkDelegate implements FrameworkDelegate {
|
||||
export function attachView(
|
||||
resolver: ComponentFactoryResolver,
|
||||
injector: Injector,
|
||||
location: ViewContainerRef,
|
||||
location: ViewContainerRef|undefined,
|
||||
appRef: ApplicationRef,
|
||||
elRefMap: WeakMap<HTMLElement, any>,
|
||||
container: any, component: any, params?: any, cssClasses?: string[]) {
|
||||
container: any, component: any, params: any, cssClasses: string[]
|
||||
) {
|
||||
const factory = resolver.resolveComponentFactory(component);
|
||||
const childInjector = Injector.create(getProviders(params), injector);
|
||||
const componentRef = location.createComponent(factory, location.length, childInjector);
|
||||
const componentRef = (location)
|
||||
? location.createComponent(factory, location.length, childInjector)
|
||||
: factory.create(childInjector);
|
||||
|
||||
const hostElement = componentRef.location.nativeElement;
|
||||
if (params) {
|
||||
Object.assign(hostElement, params);
|
||||
@ -76,6 +83,10 @@ export function attachView(
|
||||
bindLifecycleEvents(componentRef.instance, hostElement);
|
||||
container.appendChild(hostElement);
|
||||
|
||||
if (!location) {
|
||||
appRef.attachView(componentRef.hostView);
|
||||
}
|
||||
|
||||
componentRef.changeDetectorRef.reattach();
|
||||
elRefMap.set(hostElement, componentRef);
|
||||
return hostElement;
|
||||
|
@ -1,4 +1,4 @@
|
||||
import { ComponentFactoryResolver, Injectable, Injector, ViewContainerRef } from '@angular/core';
|
||||
import { ComponentFactoryResolver, Injectable, Injector } from '@angular/core';
|
||||
import { ModalOptions } from '@ionic/core';
|
||||
import { OverlayBaseController } from '../util/overlay';
|
||||
import { AngularDelegate } from './angular-delegate';
|
||||
@ -10,7 +10,6 @@ export class ModalController extends OverlayBaseController<ModalOptions, HTMLIon
|
||||
private angularDelegate: AngularDelegate,
|
||||
private resolver: ComponentFactoryResolver,
|
||||
private injector: Injector,
|
||||
private location: ViewContainerRef,
|
||||
) {
|
||||
super('ion-modal-controller');
|
||||
}
|
||||
@ -18,7 +17,7 @@ export class ModalController extends OverlayBaseController<ModalOptions, HTMLIon
|
||||
create(opts?: ModalOptions): Promise<HTMLIonModalElement> {
|
||||
return super.create({
|
||||
...opts,
|
||||
delegate: this.angularDelegate.create(this.resolver, this.injector, this.location)
|
||||
delegate: this.angularDelegate.create(this.resolver, this.injector)
|
||||
});
|
||||
}
|
||||
}
|
||||
|
@ -1,4 +1,4 @@
|
||||
import { ComponentFactoryResolver, Injectable, Injector, ViewContainerRef } from '@angular/core';
|
||||
import { ComponentFactoryResolver, Injectable, Injector } from '@angular/core';
|
||||
import { PopoverOptions } from '@ionic/core';
|
||||
import { OverlayBaseController } from '../util/overlay';
|
||||
import { AngularDelegate } from './angular-delegate';
|
||||
@ -10,7 +10,6 @@ export class PopoverController extends OverlayBaseController<PopoverOptions, HTM
|
||||
private angularDelegate: AngularDelegate,
|
||||
private resolver: ComponentFactoryResolver,
|
||||
private injector: Injector,
|
||||
private location: ViewContainerRef,
|
||||
) {
|
||||
super('ion-popover-controller');
|
||||
}
|
||||
@ -18,7 +17,7 @@ export class PopoverController extends OverlayBaseController<PopoverOptions, HTM
|
||||
create(opts?: PopoverOptions): Promise<HTMLIonPopoverElement> {
|
||||
return super.create({
|
||||
...opts,
|
||||
delegate: this.angularDelegate.create(this.resolver, this.injector, this.location)
|
||||
delegate: this.angularDelegate.create(this.resolver, this.injector)
|
||||
});
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user