AngularJS форма ввода фокус, данные не отображаются в модели

Question

Newbie to AngularJS, извините.

Я хочу, чтобы определенные входные данные формы были сосредоточены на них на основе определенных критериев. Найдено, что ответ уже with this answer (focusMe).

Проблема заключается в том, что моя форма ввода не отображается в модели.

<input type='text' name='school_name' ng-model='plan.school_name' focus-me="{{true}}"/> 

Вот jsfiddle, чтобы показать мою проблему.

Что я здесь делаю неправильно?

Answer 1

Вы определили свойство scope на объекте определения директивы. Когда вы это делаете, вы создаете изолированную область поверх всего элемента, так что все другие директивы, которые применяются к этому элементу (включая ngModel), также затрагиваются им.

Этот вопрос был рассмотрен в других местах (см. «form element ng-model change not observered in isolate scope directive watch», «ngModel and component with isolated scope» и github issue 1924), но это довольно громоздко преодолеть.

Вместо определение изолированной сферы, в данном конкретном случае, если вы мой доступ вашего атрибут focus-me с attrs объектом (с помощью $ наблюдать метод):

var myApp = angular.module('myApp',[]).directive('focusMe', function($timeout) { 
    return function(scope, element, attrs) { 
     attrs.$observe('focusMe', function(value) { 
      if (value==="true") { 
       $timeout(function(){ 
        element[0].focus(); 
       },5); 
      } 
     }); 
    } 
}); 

DEMO FIDDLE