我如何检测AngularJS中的onKeyUp?
我如何检测AngularJS中的onKeyUp?
我正在寻找类似于ngChange的“ngOnkeyup”指令,但我找不到任何合适的东西。
如果没有这样的指令,是否有一个干净的方式从浏览器本地onkeyup事件调用控制器?
编辑:请参阅下面从maklemenz引用新的内置ng-keyup指令的第二个答案
你可以使用angular-ui库 :
使用angular-ui,你可以做到
<input ui-event="{keyup: 'myFn($event)'}"
如果你不想使用另一个库,最有效和简单的方法是:
JS
myApp.directive('onKeyup', function() { return function(scope, elm, attrs) { elm.bind("keyup", function() { scope.$apply(attrs.onKeyup); }); }; });
HTML:
<input on-keyup="count = count + 1">
编辑 :如果你想检测哪个键被按下,你真的有两个基本选项。 你可以在指令中添加一个属性来处理指令中允许的键,或者你可以将按键传递给你的控制器。 我通常会build议该指令处理关键的方法。
以下是两种方式的示例: http : //jsfiddle.net/bYUa3/2
对于今天的所有人来说,请使用官方的ng-keyup指令:
<input type="text" ng-keyup="{expression}" />
如果默认指令不够,您将不得不创build自定义指令。 像这样的东西,可能是?
<!doctype html> <html lang="en" ng-app="app"> <body ng-controller="ctrl"> <input ng-onkeyup="keyup()"/> <script src="js/lib/angular-1.0.0.min.js"></script> <script> angular.module('app', []).directive('ngOnkeyup', function() { return { restrict: 'A', scope: { func: '&ngOnkeyup' }, link: function( scope, elem, attrs ) { elem.bind('keyup', scope.func); } }; }); function ctrl($scope) { $scope.keyup = function() { alert('keyup fired'); }; } </script> </body> </html>
除了已经提到的事件活页夹,你现在可以使用Angular UI的这些方便的ui-key *指令:
<textarea ui-keypress="{13:'keypressCallback($event)'}"> </textarea> <textarea ui-keydown="{'enter alt-space':'keypressCallback($event)'}"> </textarea> <textarea ui-keyup="{'enter':'keypressCallback($event)'}"> </textarea> <script> $scope.keypressCallback = function($event) { alert('Voila!'); $event.preventDefault(); }; </script>
只是为了帮助那些像我这样的人,只想在某个关键点上开火。 这里是使用ng-keyup
的代码,当只有在按下escape时,才调用我的cancel()
函数。 找出你想看看这个网站的键码
ng-keyup="$event.keyCode == 27 ? cancel() : ''"
请注意,正如@maklemenz所提到的,这里使用了现在可用的内置Angular指令
仅供参考 – 今天我只是在寻找这个,看来在Angular的github中有一个分支来解决keyup keyydown的问题。
https://github.com/angular/angular.js/pull/1622
它已经被合并成了主…但是看起来它不会在1.1.3之前出现在发行版中
为了使用ng-keyup选项来构buildangular度,你可以从git下载代码并在文件夹上运行rake package
。 当然,在Windows上,这意味着安装Node.js和Ruby,可能还有一些其他的箍(我在win32上有fork错误)
不过,我最终还是得到了“内置”的encryption。
如果我理解你的问题,你正在寻找ng-keyup指令。 这是一个链接: http : //docs.angularjs.org/api/ng.directive : ngKeyup