Estoy tratando de configurar un código para cerrar un <ion-menu> cuando hago clic fuera de él, sin embargo, cuando hago clic en cualquier lugar excepto en <ion-title> , el evento de clic apunta a la etiqueta <ion-app> . Aquí está mi código:

 <ion-menu type="overlay" side="end" menuId="first" contentId="main" (outsideClick)="clicked_outside_menu($event)"> <ion-header> <ion-toolbar color="primary"> <ion-title>Start Menu</ion-title> </ion-toolbar> </ion-header> <ion-content> <ion-list> <ion-item>Menu Item 1</ion-item> <ion-item>Menu Item 2</ion-item> <ion-item>Menu Item 3</ion-item> <ion-item>Menu Item 4</ion-item> <ion-item>Menu Item 5</ion-item> </ion-list> </ion-content> </ion-menu>

La directiva (outsideClick) está escrita de la siguiente manera:

 @HostListener('document:mousedown', ['$event']) onClick(e: MouseEvent): void { console.log(this.elementRef); console.log(this.elementRef.nativeElement); console.log(e.target); console.log(this.elementRef.nativeElement.contains(e.target)); if (!this.elementRef.nativeElement.contains(e.target)) { this.outsideClick.emit(e); } }

(Las llamadas a console.log son la forma en que he determinado que el evento tiene como objetivo la etiqueta <ion-app> ).

El único elemento en el que puedo hacer clic donde el evento de clic no apunta a la <ion-app> es el texto del título (específicamente el texto, no en ningún otro lugar de la <ion-toolbar> ) en la parte superior de este menú:

Sin embargo, cuando el menú no está abierto, los clics apuntan a los elementos HTML que esperaría, como otro texto en la pantalla, la barra de herramientas como parte de la página principal y otros elementos que también aparecen en el menú.

Parece que si agrego un botón al menú, no puedo hacer clic en él, e intentar hacer clic en él hace que el clic vuelva a apuntar a <ion-app> en la raíz de la aplicación. Parece muy extraño que <ion-title> tenga un área en la que se puede hacer clic, pero no los botones en los que se debe hacer clic. ¿Quizás están siendo bloqueados por <ion-app> cuando se abre el menú por algún motivo?

¿Alguna idea de por qué sucede esto? Sería muy bueno saber cómo solucionarlo.