我发现其他一些答案过于复杂，而你真正需要的只是这个

app.directive('autoFocus', function($timeout) {
    return {
        restrict: 'AC',
        link: function(_scope, _element) {
            $timeout(function(){
                _element[0].focus();
            }, 0);
        }
    };
});

使用

<input name="theInput" auto-focus>

我们使用超时来让dom中的东西呈现，即使它是零，它至少会等待它-这种方式也适用于模态和其他东西

我不认为$timeout是一个将元素集中在创建上的好方法。下面是一个使用内置angular功能的方法，它是从angular文档的黑暗深处挖掘出来的。注意“link”属性是如何被分为“pre”和“post”的，分别是pre-link和post-link函数。

工作示例:http://plnkr.co/edit/Fj59GB

// this is the directive you add to any element you want to highlight after creation
Guest.directive('autoFocus', function() {
    return {
        link: {
            pre: function preLink(scope, element, attr) {
                console.debug('prelink called');
                // this fails since the element hasn't rendered
                //element[0].focus();
            },
            post: function postLink(scope, element, attr) {
                console.debug('postlink called');
                // this succeeds since the element has been rendered
                element[0].focus();
            }
        }
    }
});

<input value="hello" />
<!-- this input automatically gets focus on creation -->
<input value="world" auto-focus />

完整的AngularJS指令文档:https://docs.angularjs.org/api/ng/service/$compile

当打开一个模态时，将焦点设置在这个模态内预定义的<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”进行比较，因为@总是会导致字符串。

如果所需的焦点元素被注入到指令模板中，前面的所有答案都将不起作用。 下面的指令既适用于简单元素，也适用于指令注入的元素(我用typescript写的)。它接受内部可聚焦元素的选择器。如果你只需要关注self元素——不要向指令发送任何选择器参数:

module APP.Directives {

export class FocusOnLoadDirective implements ng.IDirective {
    priority = 0;
    restrict = 'A';

    constructor(private $interval:any, private $timeout:any) {

    }

    link = (scope:ng.IScope, element:JQuery, attrs:any) => {
        var _self = this;
        var intervalId:number = 0;


        var clearInterval = function () {
            if (intervalId != 0) {
                _self.$interval.cancel(intervalId);
                intervalId = 0;
            }
        };

        _self.$timeout(function(){

                intervalId = _self.$interval(function () {
                    let focusableElement = null;
                    if (attrs.focusOnLoad != '') {
                        focusableElement = element.find(attrs.focusOnLoad);
                    }
                    else {
                        focusableElement = element;
                    }
                    console.debug('focusOnLoad directive: trying to focus');
                    focusableElement.focus();
                    if (document.activeElement === focusableElement[0]) {
                        clearInterval();
                    }
                }, 100);

                scope.$on('$destroy', function () {
                    // Make sure that the interval is destroyed too
                    clearInterval();
                });

        });
    };

    public static factory = ():ng.IDirectiveFactory => {
        let directive = ($interval:any, $timeout:any) => new FocusOnLoadDirective($interval, $timeout);
        directive.$inject = ['$interval', '$timeout'];
        return directive;
    };
}

angular.module('common').directive('focusOnLoad', FocusOnLoadDirective.factory());

}

简单元素的使用示例:

<button tabindex="0" focus-on-load />

内部元素的使用示例(通常用于动态注入元素，如directive with template):

<my-directive focus-on-load="input" />

你可以使用任何jQuery选择器来代替“input”

不确定依赖超时是否是一个好主意，但这适用于ng-repeat，因为这段代码在angularjs更新DOM后运行，所以你要确保所有对象都在那里:

myApp.directive('onLastRepeat', [function () {
        return function (scope, element, attrs) {
            if (scope.$last) setTimeout(function () {
                scope.$emit('onRepeatLast', element, attrs);
            }, 1);
        };
    }]);
    //controller for grid
    myApp.controller('SimpleController', ['$scope', '$timeout', '$http', function ($scope, $timeout, $http)
    {
        var newItemRemoved = false;
        var requiredAlert = false;
        //this event fires up when angular updates the dom for the last item
        //it's observed, so here, we stop the progress bar
        $scope.$on('onRepeatLast', function (scope, element, attrs) {
            //$scope.complete();
            console.log('done done!');
            $("#txtFirstName").focus();
        });
    }]);

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

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

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

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

<input type="text" autofocus>