AngularJS/UI - Фокусный ввод в диалогах

Question

Есть ли способ установить фокус в элементах управления вводом с помощью AngularJS/Angular-UI?

Я видел, что Angular-UI имеет некоторую директиву Jq-UI = focus, но я не могу заставить его работать.

У меня есть несколько диалоговых окон, которые я отображения с помощью диалогового Угловое-UI $ обслуживание и действительно, как первый вход в каждом диалоге, чтобы получить фокус, когда он показал

Answer 1

Последняя версия AngularJS предлагает ng-focus: http://docs.angularjs.org/api/ng/directive/ngFocus

Answer 2

Вы правы, я показал демонстрации о том, как вы можете называть собственный метод jQuery для элемента DOM, так как это все ui-jq действительно делает. Хитрость заключается в том, что она срабатывает многократно и в нужное время.

ui-jq уже выполняет метод для вас внутри $timeout, однако по умолчанию он запускается только один раз, когда создается элемент DOM. Чтобы сделать огонь ui-jq несколько раз, просто добавьте ui-refresh="someExpression" и используйте выражение, которое вы знаете будет меняться каждый раз, когда модальный открывается. Все в порядке, если он обновляется, когда модальный тоже закрыт, .focus() ничего не сделает, если элемент DOM не отображается.

Итак, для ui-bootstrap modal просто введите то же выражение, которое вы используете внутри modal="someExpression", и вы должны быть установлены.

Answer 3

Оказывается, что все, что вам нужно, если вы используете его вместе с диалоговым $ обслуживания радиально-Ui:

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

HTML:

<input type="text" focus-me > 

как уже говорилось, это для угловое разрешение Только диалоговое окно UI $.

Посмотреть здесь жить: http://strengthtracker.apphb.com (нажмите логин или зарегистрируйтесь, чтобы открыть диалоговые окна)

Answer 4

Я использовал стандартный атрибут autofocus в моем шаблоне, и объявил простую директиву, чтобы сделать его работу для элементов, созданных после (например, диалоги в вашем случае).

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