角度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); 
})