Изменить значение области действия в директиве

Question

Каков наилучший способ присвоить новое значение с помощью директивы? Двусторонняя привязка данных.

У меня есть скрипка здесь, где я пытался. http://jsfiddle.net/user1572526/grLfD/2/. Но он не работает.

Моя директива:

myApp.directive('highlighter', function() { 
    return { 
     restrict: 'A', 
     replace: true, 
       scope: { 
        activeInput: '=' 
       }, 
     link: function (scope, element, attrs) { 
      element.bind('click', function() { 
       scope.activeInput = attrs.setInput 
      }) 
     } 
    } 
}); 

И мой контроллер:

function MyCtrl($scope) { 
      $scope.active = { 
       value : true 
      }; 
} 

И мое мнение:

<h1 highlighter active-input="active.value" set-input="false">Click me to update Value in scope: {{active}}</h1> 

Так что я хочу сделать, это обновляют scope.active с данным атрибут setInput.

Любые идеи, что я делаю неправильно здесь?

Answer 1

С element.bind вы покидаете царство Углового, поэтому вам нужно сказать Угловой, что что-то случилось. Вы делаете это с scope.$apply функции:

scope.$apply(function(){ 
    scope.activeInput = attrs.setInput; 
}); 

здесь является updated jsfiddle.