1. 打开 Modal 时，将焦点设置在此 Modal 内预定义的 上。
   

定义一个指令并让它 $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。” 每次 变得可见时（例如通过单击某个按钮），将焦点设置在它上面。

创建一个基本上像上面那样的指令。观察一些范围属性，当它变为真时（在你的 ng-click 处理程序中设置它），执行element[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”进行比较，因为@ 总是产生一个字符串。