Événement de changement de propriété AngularJS/écouteur sur la liste <model>

Question

. J'ai besoin d'un observateur ou d'un événement qui sera déclenché lorsqu'une propriété sur le modèle (Détails), qui est conservée dans une liste (produits), change.

Vue:

<tr class="data-row" data-ng-repeat="c in c.products"> 
{{c.name}} <-- if c.name changes fire an event 
{{c.expire}} <-- if c.expirechanges fire an event 
{{[...]}} <-- c contains many properties 

ViewModel

c.setDirtyFlag() 
{ 
    c.dirty=true; 
} 

Y at-il une solution à ce problème AngularJS? salutations

@Shomz J'ai essayé la montre avec le code suivant. Mais lorsque la propriété c.expires sera modifiée dans le champ de saisie, la montre ne sera pas levée.

$scope.$watch("c.products.expire", function (newValue, oldValue) { 
     log.debug(newValue); 
    }); 

EDIT: Pour être plus précis: La liste des produits sera généré au cours de l'exécution. L'utilisateur peut également ajouter et supprimer des éléments. Ces objets ajoutés "temporaires" doivent également être surveillés.

Answer 1

Vous pouvez configurer $ watch sur chaque élément de la variable tableau $ scope.products et effectuer la gestion des événements de cette façon.

_.each(products, function(product) { 
    $scope.$watch(function() { return product; }, function(newVal, oldVal) { 
     if(newVal.name != oldVal.name || newVal.expire != oldVal.expire || ...) { 
      //do event work 
      product._isDirty = true; 
     } 
    }); 
}); 

Alternativement, si vous enveloppez ceci sous une forme, vous pouvez vérifier la variable sale $ pour cette forme pour voir le cas échéant.

Answer 2

Merci de m'avoir amené dans la bonne direction @wbeange. Ceci est ma solution actuelle. La liste de surveillance de $ n'a pas fonctionné comme je m'attendais donc j'ai utilisé le "vieux" $ watch.

$scope.$watch("c.products", 
       function (newValue, oldValue) { 
        //first initialising of list 
        if (typeof newValue != 'undefined' && c.products.length > 0) { 

         if (newValue != oldValue && oldValue!=null) { 

          for (var i = 0; i < newValue.length; i++) { 
           if (newValue[i].expire!= oldValue[i].expire 
            || newValue[i].otherprop != oldValue[i].otherprop) 
           { 
            //todo 
           } 
          } 

         } 
        } 
       }, 
       true // Object equality (not just reference). 
      );