Comment mettre à jour ngModel $model value est utilisée, basée sur la somme de viewValue mise à jour par l'utilisateur

Dire que j'ai la directive suivante:

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

Et le code html suivant:

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

Fondamentalement, chaque fois que l'utilisateur modifie l'entrée, my-directive, l'idéal serait de changer le modèle interne de la valeur "toto", tout en laissant le point de vue de la valeur intacte.

Mais quand j'imprime $scope.name dans le contrôleur correspondant, il n'a pas de journal "foo", il enregistre tout ce que l'utilisateur est entré.

Il semblerait que ngModelCtrl.$modelValue n'est pas ce que le contrôleur d'accès -- suis-je aborder ce problème de façon incorrecte?

(Aussi regarder la ngModel dans le champ d'application se sent vraiment mal, mais je ne suis pas sûr de toute autre manière. Toutes les suggestions seront très appréciés!)

Au lieu de regarder la ngModel vous pouvez utiliser $viewChangeListeners qui est spécifiquement conçu à cet effet. Mais pourquoi voulez-vous définir $modelValue différente de la viewValue?
J'aimerais que les utilisateurs soient en mesure d'entrer dans délimitée par des virgules de données, mais avoir le modèle sous-jacent de stocker les informations dans un tableau.
De cette façon? plnkr.co/modifier/pWpnup?p=preview
Wow, vous êtes génial, merci beaucoup!
Même que Cody (ci-dessus), je dois analyser un type="tel" et de fournir un $viewValue masque tout en préservant la $modelValue comme un entier.

OriginalL'auteur Cody | 2014-10-03

  1. 10

    Si vous êtes à la recherche pour la modification de l'affichage, vous ne devriez jamais enregistrer une montre. ngModelController de $viewChangeListeners sont spécialement conçus à cet effet et d'éviter de créer des supplémentaires de regarder sur le ngModel. Vous pouvez également supprimer les 2 voies de liaison mis en place sur le ngModel.

    Je peux penser de cette façon.

    .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(',')); 
          });
        }
    }
});

    Démo

    Tandis que d'y penser dans l'autre sens (Crédits @Cody), il devient de plus en plus concis et appropriée lors de l'utilisation d'un $parser.

     ngModelCtrl.$parsers.push(function(val) { return val.split(',') });
    Pour référence future, j'ai vérifié $parsers, et je crois que j'ai trouvé un peu plus concis solution: ngModelCtrl.$parsers.push(function(val) { return val.split(',') }).
    Non, vous avez raison.. je ne sais pas pourquoi je n'ai pas à réfléchir dans l'autre sens, probablement vraiment la fin pour le sommeil, je suppose. 🙂 ici, en fait chaque fois que la valeur est modifiée, nous l'affectation d'un tableau à l'ngModel viewvalue ainsi, mais il se stringified...

    OriginalL'auteur PSL