diff --git a/src/Squidex/app/framework/angular/modals/modal-view.directive.ts b/src/Squidex/app/framework/angular/modals/modal-view.directive.ts index b8a72d87f..01cd544fb 100644 --- a/src/Squidex/app/framework/angular/modals/modal-view.directive.ts +++ b/src/Squidex/app/framework/angular/modals/modal-view.directive.ts @@ -5,7 +5,7 @@ * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. */ -import { ChangeDetectorRef, Directive, EmbeddedViewRef, Input, OnChanges, OnDestroy, OnInit, Renderer2, SimpleChanges, TemplateRef, ViewContainerRef } from '@angular/core'; +import { ChangeDetectorRef, Directive, EmbeddedViewRef, Input, OnChanges, OnDestroy, Renderer2, SimpleChanges, TemplateRef, ViewContainerRef } from '@angular/core'; import { Subscription } from 'rxjs'; import { @@ -19,12 +19,11 @@ import { RootViewComponent } from './root-view.component'; @Directive({ selector: '[sqxModalView]' }) -export class ModalViewDirective implements OnChanges, OnDestroy, OnInit { +export class ModalViewDirective implements OnChanges, OnDestroy { private modalSubscription: Subscription | null = null; - private documentClickCounterListener: Function | null = null; private documentClickListener: Function | null = null; private renderedView: EmbeddedViewRef | null = null; - private clickCounter = 0; + private static clickCounter = 0; @Input('sqxModalView') public modalView: DialogModel | ModalModel | any; @@ -45,25 +44,24 @@ export class ModalViewDirective implements OnChanges, OnDestroy, OnInit { private readonly templateRef: TemplateRef, private readonly viewContainer: ViewContainerRef ) { + if (ModalViewDirective.clickCounter === 0) { + this.renderer.listen('document', 'click', () => { + ModalViewDirective.clickCounter++; + }); + + ModalViewDirective.clickCounter = 1; + } } public ngOnDestroy() { this.unsubscribeToModal(); this.unsubscribeToClick(); - this.unsubscribeToCounterClick(); if (Types.is(this.modalView, DialogModel) || Types.is(this.modalView, ModalModel)) { this.modalView.hide(); } } - public ngOnInit() { - this.documentClickCounterListener = - this.renderer.listen('document', 'click', () => { - this.clickCounter++; - }); - } - public ngOnChanges(changes: SimpleChanges) { if (!changes['modalView']) { return; @@ -97,7 +95,7 @@ export class ModalViewDirective implements OnChanges, OnDestroy, OnInit { this.renderer.setStyle(this.renderedView.rootNodes[0], 'display', 'block'); } - this.startListening(this.clickCounter + 1); + this.startListening(ModalViewDirective.clickCounter + 1); this.changeDetector.detectChanges(); } else if (!isOpen && this.renderedView) { @@ -123,7 +121,7 @@ export class ModalViewDirective implements OnChanges, OnDestroy, OnInit { this.documentClickListener = this.renderer.listen('document', 'click', (event: MouseEvent) => { - if (!event.target || this.renderedView === null || this.clickCounter === clickCounter) { + if (!event.target || this.renderedView === null || ModalViewDirective.clickCounter === clickCounter) { return; } @@ -165,11 +163,4 @@ export class ModalViewDirective implements OnChanges, OnDestroy, OnInit { this.documentClickListener = null; } } - - private unsubscribeToCounterClick() { - if (this.documentClickCounterListener) { - this.documentClickCounterListener(); - this.documentClickCounterListener = null; - } - } } \ No newline at end of file