Угловая атрибут директивы добавить нг-изменение

Question

я директива определяется как:

module.directive('inputChanged', function() { 
 
     function link(scope, element, attrs) { 
 
      var field = attrs.ngModel; 
 
      if (field) { 
 
       var fn = "model.changed('" + field + "')"; 
 
       element.attr('ng-change', fn); 
 
      }    
 
     } 
 

 
     return { 
 
      restrict: 'A', 
 
      link: link 
 
     } 
 
    });

, который я использую, как:

<input ng-model="model.user.middleName" input-changed type="text" class="k-textbox">

цель - динамически i nge-change с полем модели в качестве параметра. Мой сценарий на самом деле немного сложнее, но я упрощаю его для этого вопроса. Вот почему мне нужно вводить его динамически, а не размещать его непосредственно во входной разметке.

Это работает, и я вижу изменение ng в разметке после рендеринга страницы.

<input ng-model="model.user.middleName.value" type="text" class="k-textbox ng-valid ng-not-empty ng-dirty ng-valid-parse ng-touched" ng-change="model.changed('model.user.middleName.value')" aria-invalid="false">

Проблема заключается в том, что model.changed (...) не стреляя. Если я использую hardcode вместо использования директивы, все работает так, как ожидалось.

Что мне не хватает?

спасибо.

Answer 1

Вам необходимо скомпилировать элемент после добавления директивы ng-change.

angular 
    .module('app') 
    .directive('inputChanged', inputChanged); 

    function inputChanged($compile) { 

    var directive = { 
     restrict: 'A', 
     link: link, 
     terminal: true, 
     priority: 1000, 
    }; 
    return directive; 

    function link(scope, element, attrs) { 
    var field = attrs.ngModel; 
    if (field) { 
     var fn = "main.changed(" + field + ")"; 

     // Remove the attribute to prevent 
     // an infinite compile loop 
     element.removeAttr('input-changed'); 
     element.attr('ng-change', fn); 
     $compile(element)(scope); 
    } 
    } 
}; 

Working plunker.

Более подробная информация о добавлении директивы из директивы в this post.