Wie ngModel des $ modelValue basierend auf dem $ viewValue Update von Benutzereingaben

Question

Sagen, ich habe die folgende Direktive aktualisieren:

myApp.directive('myDirective', function() { 
    return { 
     restrict: 'A', 
     require: 'ngModel', 
     scope: { 
      ngModel: '=' 
     }, 
     link: function(scope, elem, attrs, ngModelCtrl) { 
      scope.$watch('ngModel', function() { 
       ngModelCtrl.$modelValue = 'foo'; 
      }); 
     } 
    } 
}); 

Und die folgende html:

<input ng-model="name" my-directive></input> 

Grundsätzlich, wenn der Benutzer Änderungen Die Eingabe my-directive würde idealerweise den internen Modellwert in "foo" ändern, während der Ansichtswert unverändert bleibt.

Aber wenn ich $scope.name im entsprechenden Controller auszudrucken, ist es nicht log „foo“, meldet er unabhängig vom Benutzer eingegebene in

Es scheint, dass ngModelCtrl.$modelValue ist nicht das, was die Steuerung zugreift. - gehe ich dieses Problem falsch an?

(Auch die ngModel im Rahmen beobachtet wirklich falsch anfühlt, aber ich bin nicht sicher, ob irgendeine andere Art und Weise. Irgendwelche Vorschläge wären sehr willkommen!)

Answer 1

Wenn Sie Ansicht ändern suchen, sollen Sie nie Registriere eine Uhr. ngModelControllers $viewChangeListeners wurden speziell für diesen Zweck entwickelt und um zu vermeiden, dass zusätzliche Watch auf dem ngModel erstellt werden. Sie können auch die 2-Wege-Bindung für das ngModel entfernen.

Ich kann auf diese Weise denken.

.directive('myDirective', function($parse) { 
    return { 
     restrict: 'A', 
     require: 'ngModel', 
     link: function(scope, elem, attrs, ngModelCtrl) { 
      /*Register a viewchange listener*/ 
      ngModelCtrl.$viewChangeListeners.push(function(){ 
       /*Set model value differently based on the viewvalue entered*/ 
       $parse(attrs.ngModel).assign(scope, ngModelCtrl.$viewValue.split(',')); 
      }); 
     } 
    } 
}); 

Demo

Während darüber die andere Art und Weise zu denken um (Credits @Cody) es wird knapper und angemessen, während ein $parser verwenden.

ngModelCtrl.$parsers.push(function(val) { return val.split(',') });