代码之家 › 专栏 › 技术社区 › William

如果在文档中的任何地方按一个键,如何获得按键?

angularjs

William · 技术社区 · 7 年前

无论何时何地,我都在尝试启动按键事件进来 ,但我只能通过使用ng键在DOM元素中指定来实现这一点。

我使用纯javascript和以下代码获得了这个结果:

document.onkeydown = function(e){
    if(e.keyCode === 13){
      //do something
    }
}

但我不确定这是最好的方法,还是“角度法”。

3 回复 | 直到 7 年前

tymeJV 7 年前

我将它包装在一个指令中,然后从那里开始,例如:

angular.module("myApp").directive("keypressDetector", function() {
    return {
        restrict: "A",
        link: function(scope, elem, attrs) {
            document.onkeydown = function(e){
                if(e.keyCode === 13){
                    //do something
                }
            }
        }
    }
})

<body keypress-detector></body>

Matthew Cawley 7 年前

要在嵌套控制器上调用函数。。。

您可以使用内置 ng-keypress <body> 标签:

<body ng-keypress="enterKeyPressed($event)">

可以绑定到上的函数 $rootScope 来自您模块的 run()

app.run(function($rootScope) {
  $rootScope.enterKeyPressed = function(e) {
    if (e.keyCode === 13) {
      $rootScope.$broadcast("EnterKeyPressed");
    }
  };
});

这会引发一个事件,可以使用 $scope 从控制器内部:

$scope.$on("EnterKeyPressed", function() {
  vm.incrementCounter();
});

演示

CodePen: Using ng-keypress with an event

-1

Ben 7 年前

如果你使用AngularJS,你应该 ng-keydown 在最外面的HTML元素上。

<body ng-keydown="myKeyDownFunction($event)"></body>

$scope.myKeyDownFunction = function($event) {
    if($event.keycode === 13) {
         // Do what you need to do
    }
}

推荐文章

learner · 如果超出限制,AngularJS ui select multiple应显示警报

2 年前

Onyx · 外部和内部div都有ng click,当我单击内部div时,两个ng click都会执行。如何预防?

2 年前

Michlut · Angular JS——从表单上传文件,并作为json对象的一部分与其他数据一起发送

2 年前

jieunbi · 按日期排序数组(最新优先)

2 年前

StackoverflowNinja · 当数字框的值在AngularJS中更改时更改下拉列表的值

2 年前

Stradosphere · 如何防止ng bind html添加结束标记?

6 年前

Celestialchippy · 如果事情是真的,如何创建一个“<a>”链接?

6 年前

a4aravind · Angulari如何使用java驱动程序访问元素?

6 年前

Nicoleta Wilskon · DecodeURIComponent不支持%uxxx编码的组件

6 年前

Nishant Florentin · 在AngularJS中发生ng if、ng show等之后,我该如何做一些动作?

6 年前