角度ng焦点/焦点输入元素

Question

我有三个输入元素作为按钮样式。在ng-keyup上我调用了我的控制器中的一个函数。

现在的问题是我对他们的一个手动点击获得焦点，只有使用keyUp工作。

我尝试了ng-focus ='focus'，然后在控制器中设置$ scope.focus = true，它不起作用。

<div class="row startButtonRow"> 
    <div class="col col-50" align="center"> 
     <button class="button button-dark startButton" ng-click="start()" ng-disabled="disableStart">Start</button> 
    </div> 

    <div class="col" align="center"> 
     <input ng-focus="focus" type="button" class="button button-dark startButton" ng-disabled="disableStop" ng-keyup="stopTimer($event)"> 
    </div> 

    <div class="col" align="center"> 
     <input type="button" class="button button-dark startButton" ng-disabled="disableStop" ng-keyup="stopTimer($event)"> 
    </div> 

    <div class="col" align="center"> 
     <input type="button" class="button button-dark startButton" ng-disabled="disableStop" ng-keyup="stopTimer($event)"> 
    </div> 

    </div> 

一旦我点击开始按钮的符号开始出现在三列，我应该按相应的按钮（按键式输入此元素），一旦一个特定的符号出现。我不想先点击元素，然后才能使用键盘按键。

Answer 1

ng-keyup不必在您的输入元素之一，你可以将它移动到你的身体元素，或任何你的ng-app元素，它仍然会抓住按键。

在另一张纸条上，我相信你误解了ng-focus的功能。它在输入焦点时评估给定的表达式，它不会告诉您的浏览器关注该元素。您将要建立一个自定义指令集中你的投入，看到How to set focus on input field?

您可以添加这样的事情你的控制器：

var handler = function(e){ 
    if (e.keyCode === 37) { 
     // left arrow 
    } else if (e.keyCode === 38) { 
     // up arrow 
    } else if (e.keyCode === 39) { 
     // right arrow 
    } 
}; 

var $doc = angular.element(document); 

$doc.on('keyup', handler); 
$scope.$on('$destroy',function(){ 
    $doc.off('keyup', handler); 
})