Angular-UI中的按键

Question

我在使用按键时遇到了一些问题，如下所示-

<div ng-controller="GBNController">
...
<input id="search-field" type="text" placeholder="JSON Query" ng-model="queryText" ui-keypress="{enter: foo()}"/>
...
</div>

我的javascript有-

var AngApp = angular.module('gbn', ['ui']);
var GBNController = function($scope) {
    $scope.queryText = '';
    $scope.foo = function() {
        alert('test');
    }
};

现在，只有在加载文档时才会调用这个函数foo，然后再也不会处理文本字段中的return按键事件。

我使用的是主分支的当前head。

是我做错了什么，还是这个坏了？？

Answer 1

您需要将foo()放在引号中。

<input ui-keypress="{enter: 'foo()'}">

Answer 2

您可以很容易地使用自己的按键指令

Here's a plunker to demo

和代码：

app.directive('zKeypress', function(){
  return {
    restrict: 'A',
    link: function(scope, elem, attr, ctrl) {
      elem.bind('keypress', function(){
        scope.$apply(function(s) {
          s.$eval(attr.zKeypress);
        });
      });
    }
  };
});

HTML

<input type="text" z-keypress="foo()"/>