Question

我有一个玩具应用程序，它模拟了我试图在angularjs中构建的打字训练程序。我无法在任何模板中成功使用ng-keypress，因此我不得不将其附加到布局中的body标签。这感觉有点尴尬，但似乎没有其他工作。

<!DOCTYPE html>
<html ng-app='TypingTrainer'>
<head>
  <title>Typing Trainer</title>
  <%= stylesheet_link_tag    'application', media: 'all'%>
  <%= javascript_include_tag 'application', controller_name %>
  <%= javascript_include_tag 'main' %> 
  <%= csrf_meta_tags %>
</head>
<body ng-keypress="$broadcast('my:keyup', $event)">

<%= yield %>

</body>
</html>

在控制器中我调用此功能。 listen函数会移动光标，如果输入的字母不正确，则会将字母的颜色更改为红色。

   $scope.$on "my:keyup", (event, keyEvent) ->
    console.log(keyEvent)
    $scope.listen(keyEvent)

感谢。

Answer 1

您可以将div设置tabindex属性设置为零：

<div tabindex="0" ng-keypress="$broadcast('my:keyup', $event)">
  ...
</div>

这也是一个黑客，但似乎有效。

在Angularjs中捕获文档级Keypress事件

1 个答案: