$ regarder un objet en angulaire

Question

Je suis sûr qu'il me manque quelque chose de très simple ici.

Je veux surveiller les changements dans un dictionnaire, mais pour une raison quelconque, le rappel n'est pas appelé.

Voici un contrôleur que j'utilise:

 function MyController($scope) {
    $scope.form = {
        name: 'my name',
        surname: 'surname'
    }

    $scope.$watch('form', function(newVal, oldVal){
        console.log('changed');
    });
}
 

Voici le violon: http://jsfiddle.net/Y8ByG/

Je m'attends à ce que le rappel soit lancé chaque fois que le nom ou le prénom est changé, mais cela n'arrive pas.

Quelle est la bonne façon de le faire?

Je vous remercie

Answer 1

Appelez $watch avec true comme troisième argument:

$scope.$watch('form', function(newVal, oldVal){
    console.log('changed');
}, true);

Par défaut lorsque l'on compare deux objets complexes en JavaScript, ils seront vérifiés pour "référence" de l'égalité, qui demande si les deux objets font référence à la même chose, plutôt que de la "valeur" de l'égalité, qui vérifie si les valeurs de toutes les propriétés de ces objets sont égaux.

Par l' Angulaire de la documentation, le troisième paramètre est pour objectEquality:

Lors de l' objectEquality == true, l'inégalité de la watchExpression est déterminé en fonction de l' angular.equals fonction. Pour enregistrer la valeur de l'objet de la comparaison ultérieure, l' angular.copy fonction est utilisée. Cela signifie donc que l'observation des objets complexes ont des effets indésirables de la mémoire et de l'incidence sur les performances.

Answer 2

L'objet form ne change pas, seule la propriété name est

mise à jour du violon: http://jsfiddle.net/ReuA8/1/

 function MyController($scope) {
$scope.form = {
    name: 'my name',
}

$scope.changeCount = 0;
$scope.$watch('form.name', function(newVal, oldVal){
    console.log('changed');
    $scope.changeCount++;
});
}
 

Answer 3

Essaye ça:

 function MyController($scope) {
    $scope.form = {
        name: 'my name',
        surname: 'surname'
    }

    function track(newValue, oldValue, scope) {
        console.log('changed');
    };

    $scope.$watch('form.name', track);
}