0

When I test (or use) my ionic 2 app in the browser, if a modal is open and I hit the "esc" key of my keyboard, the modal dismisses.
I would like to control how my modal is dismissed with a function I can customize. Similarly to how I can customize back button actions for mobile platforms.

In other words, I would like to forward "esc" key hit event to my own function.
Any suggestion ?

chateau
  • 918
  • 11
  • 24

1 Answers1

1

You can to override function dismiss():

    let alert = this.alertCtrl.create({
        title: 'Hello world'
    });

    // Just override this function:
    alert.component.prototype.dismiss = function() {
         console.log('ESC button hit handled');             
    }

    // For turn back:
    /*
    alert.component.prototype.dismiss = function (role) {
        var opts = {
            minClickBlockDuration: 400
        };
        return this._viewCtrl.dismiss(this.getValues(), role, opts);
    };  
    */

    alert.present();

EDIT:

Also i think you can use ionViewCanLeave()

In your modal view component add:

    ionViewCanLeave() {

        // ... some code ...

        return false;
    }
Dmitry Stepanov
  • 366
  • 1
  • 7
  • I don't think you read my question. My question is not about how to handle back button action. It is about handling "esc" key in browser. I already know how to register a back button action, and even refer to it in the question. – chateau Jan 04 '18 at 17:19
  • ahh... now i understand, i did edit my answer. I hope is help you! – Dmitry Stepanov Jan 05 '18 at 09:04
  • thank you for your answer, but I'm not creating an alert but a modal (with [ModalController](https://ionicframework.com/docs/api/components/modal/ModalController/)). There doesn't seem to be anything about "esc" button config in the doc (but what you talk about is also not in AlertController's doc). – chateau Jan 05 '18 at 19:00
  • 1
    docs : https://ionicframework.com/docs/api/navigation/NavController/ see **ionViewCanLeave()** Page Event – Dmitry Stepanov Jan 09 '18 at 07:43
  • using ionViewCanLeave() is a nice option, it gives some checking possibilities to dismissing a modal. I think I may have to do it this way. I'm still looking for a solution to target specifically the "esc" key, and keyboard interactions in general, so I could for example change attribution of "esc" key to something else than dismissing. – chateau Jan 14 '18 at 22:56