Question

小提琴 - http://plnkr.co/edit/NizmbUMHblixAUPfQF2G?p=preview

我正在学习AngularJS，我想尝试一些简单的事情......

每次我输入一个文本框时我都希望看到它keyCode，（我在下面的函数中使用jQuery我试图在这个例子中重写为jQuery在这种情况下，standardizes the keycode event用于跨浏览器一致性）

// Get Keycode/Which
$("[data-action=outputkeycode]").on("keyup", function(e) {
  $(this).val(e.which);
}).on("click", function() {
  $(this).select();
});

因为我尝试更新要输入的文本框以找到keyCode，我认为我在值中应用了event.keyCode，但它无效。

<body ng-app="">
  <input ng-keyup="event=$event" value="{{ event.keyCode }}">
</body>

＆＃13;

<!doctype html>
<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js"></script>
  </head>
  <body ng-app="">
    <input ng-keyup="event=$event" value="{{ event.keyCode }}">
  </body>
</html>

＆＃13;

Answer 1

如果您需要在input中显示密钥代码，则可以使用以下代码

<input ng-keydown="event=$event.keyCode; $event.preventDefault()" ng-model="event">

当键按下ng-keyup之前我们将keycode分配给event范围变量时，我们会阻止其默认操作，即键入文本框中的实际字符。

并在此处指定ng-model="event"文本框获取event范围变量的值

<!doctype html>
<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js"></script>
  </head>
  <body ng-app="">
    <input ng-keydown="event=$event.keyCode; $event.preventDefault()" ng-model="event">
  </body>
</html>

<强>更新

在文本框中单击选择文本。

您可以创建一个角度指令来选择文本框文本，这是一个很好的directive

这是updated demo

Answer 2

试试这个代码段：

<!doctype html>
<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js"></script>
  </head>
  <body ng-app="">
    <input ng-keyup="keyCode=$event.keyCode" ng-model="keyCode">
  </body>
</html>

AngularJS KeyUp将值更改为keyCode

2 个答案: