angular-esc-action

Escape Key Handler for Angular

Live Demo

Click inside the element to give it focus and then hit the escape key.

Demo Source

<div tabindex="0"
     ng-init="count = 0"
     ng-bind="count"
     esc-action="count = count + 1">
</div>

Overview

angular-esc-action allows you to attach an escape key handler to an element without having to locate the element within the DOM.

Download

Grab the latest from GitHub or use your favorite package manager:

Via Bower

bower install angular-esc-action

Via NPM

npm install angular-esc-action

Usage

Include angular-esc-action.js in your application, after Angular is included.

<script src="path/to/angular.js"></script>
<script src="path/to/angular-esc-action.js"></script>

You may use an AMD or CommonJS loader as well.

Initialize your Angular application with the mp.escAction module as a dependency:

angular.module('app', [ 'mp.escAction' ]);

Then use the esc-action attribute to specify an expression to evaluate when the escape key is pressed:

<div class="dialog" tabindex="0" esc-action="closeDialog()">
</div>

Make sure that the element or a parent element is focusable by providing a tabindex. The escape key press will only be captured while the element (or a parent) has focus.

License

MIT