按ID設置焦點角

Question

單擊+按鈕後，焦點將轉移到HTML中的另一個輸入字段。除非用戶單擊另一個輸入字段，否則我希望將焦點放在當前輸入字段上。那時我想將焦點移至點擊的輸入字段。

<div layout="row" layout-align="center center"> 
    <md-input-container class="md-block" flex="50"> 
     <input required id="circleTimeWordListEditText" type="text" placeholder="Words List" ng-model="circleTime.word"/> 

     <div ng-messages="$error"> 
      <div ng-message="required">This is required.</div> 
     </div> 
    </md-input-container> 
</div> 

<div layout="row" layout-align="center center"> 
    <md-button class="md-raised md-primary" type="submit" 
       ng-click="circleTime.onAddButtonClicked()">+ 
    </md-button> 
</div> 

目前，我這樣做：

document.getElementById('circleTimeWordListEditText').focus(); 

，我已經試過這很好，但它給了我NOSEL錯誤。

angular.element('circleTimeWordListEditText').focus(); 

我想這個解決方案也：

mainApp.factory('focus', function($timeout, $window) { 
    return function(id) { 
     // timeout makes sure that it is invoked after any other event has been triggered. 
     // e.g. click events that need to run before the focus or 
     // inputs elements that are in a disabled state but are enabled when those events 
     // are triggered. 
     $timeout(function() { 
      var element = $window.document.getElementById(id); 
      if(element) 
       element.focus(); 
     }); 
    }; 
}); 

mainApp.directive('eventFocus', function(focus) { 
    return function(scope, elem, attr) { 
     elem.on(attr.eventFocus, function() { 
      focus(attr.eventFocusId); 
     }); 

     // Removes bound events in the element itself 
     // when the scope is destroyed 
     scope.$on('$destroy', function() { 
      elem.off(attr.eventFocus); 
     }); 
    }; 
}); 


onAddButtonClicked : function(elem) { 
      //do stuff 

      focus('circleTimeWordListEditText'); 
      /*var temp = document.getElementById('circleTimeWordListEditText'); 
      alert(temp); 
      temp.focus(); 
      angular.element('circleTimeWordListEditText'); 
      angular.element('circleTimeWordListEditText').focus();*/ 
     } 
    }, 

，但它也不起作用。

這個問題的建議解決方案是什麼？

Answer 1

我認爲你可以使用下面的代碼片段。

var myEl = document.getElementById('circleTimeWordListEditText'); 
var angularEl = angular.element(myEl); 

angularEl.focus(); 

Answer 2

我遇到了同樣的問題。這對我有效。我希望這也適合你！

function someFunction() 
{ 
var element = angular.element("#id here"); 
element.focus() 
} 

對你來說，以下可能的工作：

function onAddButtonClicked() 
{ 
    var element = angular.element("#circleTimeWordListEditText"); 
    element.focus() 
}