从 angularJS 控制器将焦点设置到文本框答案

【问题标题】：set focus to textbox from angularJS controller从 angularJS 控制器将焦点设置到文本框
【发布时间】：2018-10-22 08:23:21
【问题描述】：

我正在创建一个使用 angularJS 的网络应用程序，我有一个 jqueryui datepicker，它看起来像这样

<input type="text" ng-model="rc.reg.mddoj" ng-blur="rc.dojChange()" title="Date Of Joining" placeholder="Date Of Joining" class="form-control" datepicker />

在我的控制器中

r.dojChange = function () {
    var currentTarget = event.target;
    setTimeout(function () { r.reg.mddoj = currentTarget.value; }, 500);
}

执行此操作后，我想将焦点设置到下一个控件

<input type="text" ng-model="rc.reg.mdemail" title="EmailID" placeholder="EmailID" class="form-control validatingData" />

如何从 angularJS 控制器设置对元素的控制。

我只想将焦点从指令设置到我的元素，并想在我的 r.dojChange function() 中调用该指令

【问题讨论】：

标签： javascript angularjs angularjs-directive angularjs-controller

【解决方案1】：

要从 AngularJS 代码中聚焦元素，您必须执行以下操作：

$timeout(function() {
   const elementToFocus = $element[0].querySelector(<SELECTOR TO YOUR ELEMENT>);
   if (elementToFocus) {
      elementToFocus.focus();
   }
}, 0);

【讨论】：

其实我以前也这样做过，我见过一些他们使用指令的例子，但我无法做到这一点，但我想这样做
据我了解，您想在选择日期选择器中的日期后将焦点设置在下一个元素上？你确定你需要指令吗？因为它不会是明确的解决方案。

【解决方案2】：

如果您使用setTimeout，则必须使用$scope.$apply() 以确保对范围的更改得到处理。或者你可以使用$timeout：

r.dojChange = function() {
  var currentTarget = event.target;
  $timeout(function() {
    r.reg.mddoj = currentTarget.value; 
    document.querySelector('[title="EmailID"]').focus(); //<---
  }, 500)
}

【讨论】：