这工作得很好，并以一种角度的方式来聚焦输入控件

angular.element('#elementId').focus()

虽然这不是一种纯粹的角方式来完成任务，但语法遵循了角风格。Jquery使用Angular间接和直接访问DOM (jQLite => Jquery Light)。

如果需要，这段代码可以很容易地放在一个简单的角指令中，其中element可以直接访问。

一个简单的情态动词:

.directive('focusMeNow', ['$timeout', function ($timeout)
{
    return {
        restrict: 'A',

        link: function (scope, element, attrs)
        {


            $timeout(function ()
            {
                element[0].focus();
            });



        }
    };
}])

例子

<input ng-model="your.value" focus-me-now />

这可能是ES6时代最简单的解决方案。

添加下面的一行指令使得HTML的“autofocus”属性在Angular.js上有效。

.directive('autofocus', ($timeout) => ({link: (_, e) => $timeout(() => e[0].focus())}))

现在，你可以使用HTML5自动对焦语法，比如:

<input type="text" autofocus>

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

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

…尝试使用布尔值来聚焦输入，然后模糊输入，然后尝试再次使用它来聚焦输入。它不会工作，除非你重置布尔值为假，然后$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);
    });
  }
});

当打开一个模态时，将焦点设置在这个模态内预定义的<input>上。

定义一个指令，并让它$watch一个属性/触发器，这样它就知道什么时候聚焦元素:

Name: <input type="text" focus-me="shouldBeOpen">

app.directive('focusMe', ['$timeout', '$parse', function ($timeout, $parse) {
    return {
        //scope: true,   // optionally create a child scope
        link: function (scope, element, attrs) {
            var model = $parse(attrs.focusMe);
            scope.$watch(model, function (value) {
                console.log('value=', value);
                if (value === true) {
                    $timeout(function () {
                        element[0].focus();
                    });
                }
            });
            // to address @blesh's comment, set attribute value to 'false'
            // on blur event:
            element.bind('blur', function () {
                console.log('blur');
                scope.$apply(model.assign(scope, false));
            });
        }
    };
}]);

砰砰作响

$timeout似乎需要给模态渲染时间。

“2”。每次<input>变为可见时(例如，通过单击某个按钮)，将焦点设置在它上。

创建一个本质上类似于上面的指令。观察某些作用域属性，当它为真时(在ng-click处理程序中设置它)，执行元素[0].focus()。根据你的用例，你可能需要也可能不需要$timeout:

<button class="btn" ng-click="showForm=true; focusInput=true">show form and
 focus input</button>
<div ng-show="showForm">
  <input type="text" ng-model="myInput" focus-me="focusInput"> {{ myInput }}
  <button class="btn" ng-click="showForm=false">hide form</button>
</div>

app.directive('focusMe', function($timeout) {
  return {
    link: function(scope, element, attrs) {
      scope.$watch(attrs.focusMe, function(value) {
        if(value === true) { 
          console.log('value=',value);
          //$timeout(function() {
            element[0].focus();
            scope[attrs.focusMe] = false;
          //});
        }
      });
    }
  };
});

砰砰作响

更新7/2013:我见过一些人使用我最初的隔离作用域指令，然后在嵌入输入字段(即模态中的输入字段)方面出现问题。没有新的作用域(或者可能是新的子作用域)的指令应该可以减轻一些痛苦。所以上面我更新了答案，不使用隔离作用域。以下是原始答案:

原来答案是1。，使用隔离作用域:

Name: <input type="text" focus-me="{{shouldBeOpen}}">

app.directive('focusMe', function($timeout) {
  return {
    scope: { trigger: '@focusMe' },
    link: function(scope, element) {
      scope.$watch('trigger', function(value) {
        if(value === "true") { 
          $timeout(function() {
            element[0].focus(); 
          });
        }
      });
    }
  };
});

砰砰作响。

原来答案是2。，使用隔离作用域:

<button class="btn" ng-click="showForm=true; focusInput=true">show form and
 focus input</button>
<div ng-show="showForm">
  <input type="text" focus-me="focusInput">
  <button class="btn" ng-click="showForm=false">hide form</button>
</div>

app.directive('focusMe', function($timeout) {
  return {
    scope: { trigger: '=focusMe' },
    link: function(scope, element) {
      scope.$watch('trigger', function(value) {
        if(value === true) { 
          //console.log('trigger',value);
          //$timeout(function() {
            element[0].focus();
            scope.trigger = false;
          //});
        }
      });
    }
  };
});

砰砰作响。

由于我们需要重置指令中的trigger/focusInput属性，'='用于双向数据绑定。在第一个指令中，'@'就足够了。还要注意，当使用“@”时，我们将触发器值与“true”进行比较，因为@总是会导致字符串。

我想在寻找一个更好的解决方案，但没有找到它，而是不得不创造它之后，为这个讨论做出贡献。

标准: 1. 解决方案应该独立于父控制器范围，以增加可重用性。 2. 避免使用$watch来监视某些条件，这既缓慢，又增加了摘要循环的大小，并且使测试更加困难。 3.避免$timeout或$scope.$apply()触发摘要循环。 4. input元素出现在使用Directive打开的元素中。

这是我最喜欢的解决方案:

指令:

.directive('focusInput', [ function () {
    return {
        scope: {},
        restrict: 'A',
        compile: function(elem, attr) {
            elem.bind('click', function() {
                elem.find('input').focus();                
            });
        }        
    };
}]);

Html:

 <div focus-input>
     <input/>
 </div>

我希望这篇文章能帮助到一些人!