使用 ESC 键清除 Angular / AngularUI 中的输入文本字段

在我的 Angular 应用程序的几个地方，我需要使用 ESC 键清除用户的输入。问题是，我不知道如何使用文本输入字段（文本区域清除正常）。看看这个小提琴：

jsFiddle演示问题 http://jsfiddle.net/aGpNf/188/

Binding:

<input ng-model="search.query" ui-keypress="{esc: 'keyCallback($event)'}" />

我使用的回调：

$scope.keyCallback = function($event) {
  $event.preventDefault();
  $scope.search.query = '';
}

任何人都可以，请弄清楚我需要做什么才能用 ESC 键清除文本输入?

解决方案：据建议bmleite https://stackoverflow.com/users/651480/bmleite，你不应该听“按键”，而是听‘按下键’ and 'keyup'。问题是，“keydown”在 Firefox 中不起作用，因此只有“keyup”才能实现监听 ESC 的魔术。 ;)

工作小提琴：http://jsfiddle.net/aGpNf/190/ http://jsfiddle.net/aGpNf/190/

解决方案更新：最后我不得不监听“keydown”和“keyup”事件。因为在我的例子中，FF 确实将 ESC 键按下时的输入字段重置为之前的状态，所以它弄乱了我的模型。因此，“keyup”清除模型，“keydown”检查模型是否为空并执行适当的操作。我还需要手动对输入进行散焦以防止文本重新弹出。：/

接受的答案不起作用 https://github.com/angular/angular.js/issues/7297适用于 IE 10/11。这是一个解决方案基于另一个问题 https://stackoverflow.com/questions/17470790/how-to-use-a-keypress-event-in-angularjs这样做：

指示

.directive('escKey', function () {
  return function (scope, element, attrs) {
    element.bind('keydown keypress', function (event) {
      if(event.which === 27) { // 27 = esc key
        scope.$apply(function (){
          scope.$eval(attrs.escKey);
        });

        event.preventDefault();
      }
    });
    scope.$on('$destroy', function() {
        element.unbind('keydown keypress')
    })
  };
})

HTML:

<input ... ng-model="filter.abc" esc-key="resetFilter()" >

Ctrl

$scope.resetFilter = function() {
  $scope.filter.abc = null;
};