AngularJS/UI - Focus input in dialogs

Question

Is there any way to set focus in input controls using AngularJS/Angular-UI ?

I saw that Angular-UI has some Jq-UI=focus directive but I'm unable to get it to work.

I have a few dialogs that I display using Angular-UI $dialog service and would really like the first input on each dialog to get focus once it's shown

Answer 1

I used the standard autofocus attribute in my template, and declared a simple directive to make it work for elements that are created after page load (like dialogs in your case).

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

Answer 2

Turns out that all you need is this if you use it together with the Angular-ui $dialog service:

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

html:

  <input type="text" focus-me >

as stated, this is for Angular-UI $dialog service only.

See it live here: http://strengthtracker.apphb.com (click login or register to bring up the dialogs)