Question

有没有办法使用AngularJS / Angular-UI在输入控件中设置焦点？

我看到Angular-UI有一些Jq-UI =焦点指令，但是我无法让它工作。

我有一些使用Angular-UI $对话框服务显示的对话框，并且非常希望每个对话框上的第一个输入在显示后获得焦点

Answer 1

我在模板中使用了标准的autofocus属性，并声明了一个简单的指令，使其适用于在页面加载后创建的元素（如您的情况下的对话框）。

app.directive('autofocus', function () {
  return {
    restrict: 'A',
    link: function (scope, element) {
      element[0].focus();
    }
  };
});

Answer 2

如果你将它与Angular-ui $对话服务一起使用，你需要的就是这个：

app.directive('focusMe', function ($timeout) {    
    return {    
        link: function (scope, element, attrs, model) {                
            $timeout(function () {
                element[0].focus();
            });
        }
    };
});

HTML：

  <input type="text" focus-me >

如上所述，这仅适用于Angular-UI $对话服务。

在此处查看：http://strengthtracker.apphb.com（点击登录或注册以显示对话框）

Answer 3

你是对的，我已经展示了如何在DOM元素上调用jQuery的本地jQuery.fn.focus()方法，因为这是所有ui-jq真正做到的。诀窍是让它在适当的时间点火多次。

ui-jq已在$timeout内为您执行该方法，但默认情况下，只在创建DOM元素时触发一次。为了使ui-jq多次触发，只需添加ui-refresh="someExpression"并使用您知道的表达式，每次模态打开时都会更改。如果在模态关闭的情况下它也会重新启动，如果DOM元素不可见，.focus()将无效。

因此，对于ui-bootstrap模式，只需在modal="someExpression"中放置您正在使用的相同表达式，就应该设置它。

Answer 4

AngularJS的最新版本提供了ng-focus：http://docs.angularjs.org/api/ng/directive/ngFocus

AngularJS / UI - 在对话框中聚焦输入

4 个答案: