IE элемент ввода фокус не работает с угловой директивой

Question

У меня есть div, динамически заполненный входными элементами и устанавливающий фокус на первом поле ввода. Основное внимание уделяется Chrome, но не IE. Здесь находится plnkr http://plnkr.co/edit/b6urKKilDVRwuqVQfbWt

Фокус в действительности выполняется внутри функции таймаута, но все же фокус ничего не делает в поле ввода. Я использую угловую директиву для создания элементов формы.

directive('ngppParameters', ["$compile","$timeout",function($compile,$timeout) { 
    return { 
     restrict: 'E',  
     link:function($scope,$element,$attrs) 
     { 
      $scope.$watch("tree.length", function (value) {  

       if(value.length===0) 
        return;     

       $timeout(function() { 
        var fields = $("ngpp-parameters input").filter(":visible:first"); 
        console.log("Setting the focus"); 
        if(fields.length>0) 
        { 
         console.log("Setting focus"); 
         fields[0].focus();     

        } 
       },10);    
      }); 
     }   
    }; 

Update:

Это директива.

Answer 1

Наконец-то возникла проблема, IE обращается с отключенным родителем и не позволяет установить фокус на детей.

Я удалил disabled = "disabled" attr из директивы pp-поля и работает как ожидалось. Все остальные браузеры, кроме IE, не рассматривают состояние отключенных родителей.

Answer 2

fields[0] Это не то, что вы думаете (я был пойман этой же ошибкой раньше).

Вы хотите fields.eq(0)

https://api.jquery.com/eq/

Вы также могли бы просто назвать fields.focus(). Если там есть только один, который должен работать.

Answer 3

Убедитесь, что вы используете ng-disabled="" вместо атрибута disabled, чтобы браузеры могли игнорировать его и вести себя так, как ожидалось.