diff --git a/src/components/angular2-modal/plugins/vex/dialog-form-modal.ts b/src/components/angular2-modal/plugins/vex/dialog-form-modal.ts index 14b782f0..ce5673d7 100644 --- a/src/components/angular2-modal/plugins/vex/dialog-form-modal.ts +++ b/src/components/angular2-modal/plugins/vex/dialog-form-modal.ts @@ -118,7 +118,8 @@ export class DialogFormModal implements AfterViewInit, ModalComponent{{context.message}}
- + selector: 'modal-content', + template: `
`, - encapsulation: ViewEncapsulation.None, + encapsulation: ViewEncapsulation.None, }) export class VexModalContent implements AfterViewInit { - private context: VEXModalContext; - @ViewChild('modalDialog', {read: ViewContainerRef}) private _viewContainer: ViewContainerRef; + private context: VEXModalContext; + @ViewChild('dlgContainer') private dlgContainer: ElementRef; + @ViewChild('modalDialog', {read: ViewContainerRef}) private _viewContainer: ViewContainerRef; - constructor(public dialog: DialogRef, - private el: ElementRef, - private _modal: Modal, - private _compileConfig: ModalCompileConfig, - private _cr: ComponentResolver) { - this.context = dialog.context; - } + constructor(public dialog: DialogRef, + private _modal: Modal, + private _compileConfig: ModalCompileConfig, + private _cr: ComponentResolver) { + this.context = dialog.context; + } - ngAfterViewInit() { - this._cr.resolveComponent(this._compileConfig.component) - .then(cmpFactory => { - const vcr = this._viewContainer, - bindings = this._compileConfig.bindings, - ctxInjector = vcr.parentInjector; + ngAfterViewInit() { + this._cr.resolveComponent(this._compileConfig.component) + .then(cmpFactory => { + const vcr = this._viewContainer, + bindings = this._compileConfig.bindings, + ctxInjector = vcr.parentInjector; - const childInjector = Array.isArray(bindings) && bindings.length > 0 ? - ReflectiveInjector.fromResolvedProviders(bindings, ctxInjector) : ctxInjector; + const childInjector = Array.isArray(bindings) && bindings.length > 0 ? + ReflectiveInjector.fromResolvedProviders(bindings, ctxInjector) : ctxInjector; - if (this.el.nativeElement) { - this.el.nativeElement.focus(); - } + if (this.dlgContainer.nativeElement) { + this.dlgContainer.nativeElement.focus(); + } - return this.dialog.contentRef = - vcr.createComponent(cmpFactory, vcr.length, childInjector); - }); - } + return this.dialog.contentRef = + vcr.createComponent(cmpFactory, vcr.length, childInjector); + }); + } - onClickOutside() { - // check that this modal is the last in the stack. - return this._modal.isTopMost(this.dialog) && - !this.dialog.context.isBlocking && - this.dialog.dismiss(); - } + onClickOutside() { + // check that this modal is the last in the stack. + return this._modal.isTopMost(this.dialog) && !this.dialog.context.isBlocking && + this.dialog.dismiss(); + } }