Material: Prevent ESC key from closing the menu

Created on 22 Mar 2015  路  5Comments  路  Source: angular/material

Is there a way to prevent the ESC key to close the side nav menu?
I tried to listen on the document's keyup event, but to no avail.

team discussion won't fix

Most helpful comment

I love angular material but this is very poorly handled.

md-is-locked-open="true || <expression>" is a bad solution as it doesn't work as expected (strange twitching and bad response). The only other solution i found is to cut out line 93 of angular-material.js, what seems like an awful solution.

under Services ($mdSidenav)
https://material.angularjs.org/1.1.3/api/service/$mdSidenav
there was a glimmer of hope that onClose handler exists, that turned out to be a document bug or something?

$mdSidenav(componentId).onClose(function(){});
method does not even exist:
screen shot 2017-01-31 at 15 27 56

overall i don't have an idea how to solve this without going into source.
Using finally is also not a solution as escape doesnt have a trigger.

All 5 comments

Can you explain your use case? The ESC key is enabled for keyboard accessibility purposes.

Hi,
My use case is quite simple - once the menu is closed, there's no way to get it back (this is the design of my app). I can overcome this by closing the menu (as happens now) and adding some 2em width div in its stead. Clicking the placeholder div would reopen the menu. I was hoping to avoid this extra logic by just disabling the ESC key event...

Can you not use md-is-locked-open="true || <expression>" ?

I have same problem.
While I open mdDialog, than press Esc and modal closed as mdSidenav closed to! And this is really problem. How can I prevent this function of angular material??

/**
* Auto-close sideNav when the escape key is pressed.
* @param evt
*/
function onKeyDown(ev) {
var isEscape = (ev.keyCode === $mdConstant.KEY_CODE.ESCAPE);
return isEscape ? close(ev) : $q.when(true);
}

Thank you for answer!

I love angular material but this is very poorly handled.

md-is-locked-open="true || <expression>" is a bad solution as it doesn't work as expected (strange twitching and bad response). The only other solution i found is to cut out line 93 of angular-material.js, what seems like an awful solution.

under Services ($mdSidenav)
https://material.angularjs.org/1.1.3/api/service/$mdSidenav
there was a glimmer of hope that onClose handler exists, that turned out to be a document bug or something?

$mdSidenav(componentId).onClose(function(){});
method does not even exist:
screen shot 2017-01-31 at 15 27 56

overall i don't have an idea how to solve this without going into source.
Using finally is also not a solution as escape doesnt have a trigger.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

PeerInfinity picture PeerInfinity  路  3Comments

robertmesserle picture robertmesserle  路  3Comments

bobber205 picture bobber205  路  3Comments

kasajian picture kasajian  路  3Comments

WebTechnolog picture WebTechnolog  路  3Comments