In my Ionic 3 app, I have a specific page called Page1 that requires customized keyboard handling. Here is how I implemented it on Page1:
@Component({
...
host: {
'(document:keydown)': 'handleKeyboardEvents($event)'
}
})
export class Page1{
...
handleKeyboardEvent(event: KeyboardEvent) {
if(event.which == 13){
console.log("You pressed Enter!");
}
}
Everything works as expected on Page1. However, there is a button 'go to Page2' on Page1 that, when clicked, navigates to Page2 using this code:
this.navCtrl.push(Page2, {});
Upon reaching Page2, pressing the 'Enter' button on the keyboard triggers the handleKeyboardEvent function and logs a message to the console. I want this keyboard handling to be exclusive to Page1 and not affect any other pages currently in the stack.
How can I prevent this behavior from happening?