In my component, I have a property called enableButtons which is set to true when I click on an ion-menu label. However, I want this property to revert to false if I click anywhere else. Here's the code I tried:
export class ProfilePage implements OnInit {
enableButtons: boolean;
constructor(private router: Router,private menu: MenuController) {
this.enableButtons= false;
window.onclick = function(event) {
if(this.enableButtons){
this.enableButtons = false;
}
}
}
async presentModalEliminaItems() {
this.menu.close();
this.enableButtons = true;
}
The issue here is that "this" in the window.onclick function refers to Window type instead of ProfilePage type. How can I resolve this?
SOLVED: I resolved it by using Angular's Renderer2 class instead of window.onclick:
@ViewChild('aEliminaVideo') toggleButton: ElementRef;
this.renderer.listen('window', 'click',(e:Event)=>{
if(e.target!==this.toggleButton.nativeElement && this.enableButtons == true){
this.enableButtons = false;
}
});