这也可以使用ngModelController。使用1.6以上版本(不知道是否使用旧版本)。

HTML

<form name="myForm">
    <input type="text" name="myText" ng-model="myText">
</form>

JS

$scope.myForm.myText.$$element.focus();

--

注意:根据上下文的不同，您可能需要封装一个超时函数。

注意²:当使用controllerAs时，这几乎是相同的。只需将name="myForm"替换为name="vm "。在JS中，vm.myForm.myText.$$element.focus();。

这也可以使用ngModelController。使用1.6以上版本(不知道是否使用旧版本)。

HTML

<form name="myForm">
    <input type="text" name="myText" ng-model="myText">
</form>

JS

$scope.myForm.myText.$$element.focus();

--

注意:根据上下文的不同，您可能需要封装一个超时函数。

注意²:当使用controllerAs时，这几乎是相同的。只需将name="myForm"替换为name="vm "。在JS中，vm.myForm.myText.$$element.focus();。

##(编辑:我已经在这个解释下面添加了一个更新的解决方案)

马克·拉杰科克是…他的答案是一个有效的答案，但它有一个缺陷(对不起，马克)…

…尝试使用布尔值来聚焦输入，然后模糊输入，然后尝试再次使用它来聚焦输入。它不会工作，除非你重置布尔值为假，然后$digest，然后重置为真。即使在表达式中使用字符串比较，也必须将字符串更改为其他内容$digest，然后再更改回来。(这个问题已经通过模糊事件处理程序解决了。)

所以我提出了这个替代方案:

使用事件，Angular中被遗忘的特性。

JavaScript终究喜欢事件。事件本质上是松散耦合的，更好的是，您可以避免向$摘要中添加另一个$watch。

app.directive('focusOn', function() {
   return function(scope, elem, attr) {
      scope.$on(attr.focusOn, function(e) {
          elem[0].focus();
      });
   };
});

所以现在你可以这样使用它:

<input type="text" focus-on="newItemAdded" />

然后在应用程序的任何地方。

$scope.addNewItem = function () {
    /* stuff here to add a new item... */

    $scope.$broadcast('newItemAdded');
};

这太棒了，因为你可以用它做各种各样的事情。首先，你可以把已经存在的事件联系起来。另一方面，你开始做一些聪明的事情，让应用程序的不同部分发布事件，让应用程序的其他部分可以订阅。

无论如何，这种类型的东西对我来说就是“事件驱动”。我认为作为Angular开发人员，我们真的很努力地把$scope形状的钉子钉进事件形状的洞里。

这是最好的解决方案吗?我不知道。这是一个解决方案。

更新的解决方案

在@ShimonRachlenko下面的评论之后，我稍微改变了我的方法。现在我使用服务和指令的组合来处理“幕后”事件:

除此之外，它与上面概述的原理相同。

下面是一个快速的Plunk演示

# # #使用

<input type="text" focus-on="focusMe"/>

app.controller('MyCtrl', function($scope, focus) {
    focus('focusMe');
});

# # #源

app.directive('focusOn', function() {
   return function(scope, elem, attr) {
      scope.$on('focusOn', function(e, name) {
        if(name === attr.focusOn) {
          elem[0].focus();
        }
      });
   };
});

app.factory('focus', function ($rootScope, $timeout) {
  return function(name) {
    $timeout(function (){
      $rootScope.$broadcast('focusOn', name);
    });
  }
});

HTML有一个属性autofocus。

<input type="text" name="fname" autofocus>

http://www.w3schools.com/tags/att_input_autofocus.asp

对于那些使用Bootstrap插件的Angular用户:

http://angular-ui.github.io/bootstrap/#/modal

你可以挂钩到模态实例的开放承诺:

modalInstance.opened.then(function() {
        $timeout(function() {
            angular.element('#title_input').trigger('focus');
        });
    });

modalInstance.result.then(function ( etc...

如果你只是想要一个简单的焦点，由ng-click控制。

Html:

<input ut-focus="focusTigger">

<button ng-click="focusTrigger=!focusTrigger" ng-init="focusTrigger=false"></button>

指令:

'use strict'

angular.module('focus',['ng'])
.directive('utFocus',function($timeout){
    return {
        link:function(scope,elem,attr){
            var focusTarget = attr['utFocus'];
            scope.$watch(focusTarget,function(value){
                $timeout(function(){
                    elem[0].focus();
                });
            });
        }
    }
});