Focus on the html element after turning it on

Question

I have the following problem: I would like to focus on typing. But I have a counter that starts when the page loads and is hidden only when certain HTTP requests are made. Also, all inputs are disabled until requests are completed. So it looks like this:

<fieldset ng-disabled="!noPendingRequests">
    ...
    <input id="input-to-focus-on" uib-datepicker-popup="MM/dd/yyyy" type="text" ng-model="startDate" ... />
    <spinner ng-hide="noPendingRequests"></spinner>
</fieldset>

Spinner is the usual Angular directive. There is a requirement for autofocus at the input #input-to-focus-on, but it does not work. I tried to focus right after all http requests were resolved with $q.all. But that doesn't work either. I assume this happens because the callback in is $qstarted before the input is activated. I also tried manual inclusion:

$q.all(somePromises).then(function() {
    angular.element('#input-to-focus-on')[0].disabled = false;
    angular.element('#input-to-focus-on')[0].tabIndex = 1;
    angular.element('#input-to-focus-on').focus();
 });

, . , !

Answer 1

$timeout.

$timeout(function () {
  angular.element('#input-to-focus-on').focus();
});

Answer 2

:

$q.all(somePromises).then(function() {
   $timeout(function () {
      angular.element('#input-to-focus-on')[0].focus();
    });
});

, , $timeout, .