Probleme mit isolierten Bereich und Bindungen

Question

Ich versuche, Richtlinie zu erstellen, in dem ich das Modell beim Klicken durch Element ändern möchte. Irgendeine Art von Kontrollkästchen ... ist hier mein Code

mainApp.directive('subCategory', function(){ 
    return{ 
     restrict: 'A', 
     scope: { 
      model: '=?ngModel' 
     }, 
     link : function(scope, element){ 

      scope.model = true; 
      element.click(function() { 

      if (element.hasClass('active')) { 
       element.removeClass('active'); 
       scope.model = false; 
      } else { 
       element.addClass('active'); 
       scope.model = true; 
      } 

     }); 
     } 
    } 
}); 

als ich versuchen zu $ ​​sehen Gruppe dieses Kontrollkästchen in geordneten Steuerung von Objekt zu beobachten, die ng-Modell-Eigenschaften aller Kontrollkästchen enthält.

mainApp.controller('Filter',['$scope', function ($scope) { 
$scope.data = {} 

$scope.$watchCollection('data', function(newNames, oldNames) { 
    console.log('changed'); 
}); 

}]); 

Wenn ich Eigenschaft definieren, indem scope.model = true; es funktioniert und Arbeiten zu beobachten, aber wenn ich scope.model auf Klick in irgendwelchen Gründen ändert sich nicht beeinflussen data Objekt und Uhr funktioniert nicht. Kann mir jemand sagen warum?
Danke!

Answer 1

In Ihrer Richtlinie Änderung

scope: { 
     model: '=?ngModel' 
    }, 

Um

scope: { 
     model: '=ngModel' 
    }, 

wie oben erwähnt, wenn Sie passieren ngModel Funktion zu verknüpfen, die ist, wenn Sie

require:'?ngModel'