AngularJS $ scope. $ Guarda le proprietà di $ scope.foo ma invia vecchi valori al server prima della modifica

Question

Ho un oggetto $ scope.foo nel mio controller. Voglio controllare eventuali cambiamenti in $ scope.foo.bar e $ scope.foo.baz e fare una richiesta get e sostituire tutti i dati in $ scope.foo oggetto. Prima che questo cambiamento avvenga, vorrei inviare i dati di $ scope.foo al server con i vecchi $ scope.foo.bar e $ scope.foo.baz.

$scope.$watch('foo.bar + form.baz', function() { 
    // send old $scope.foo to server with the 
    // previous $scope.foo.bar and $scope.foo.baz 
}); 

Come faccio a fare questo? TIA

Answer 1

Il secondo parametro di $scope.$watch è una funzione che riceve due parametri: il primo è il nuovo valore, il secondo il vecchio valore.

Si può semplicemente guardare per tutta la foo oggetto, e impostare il terzo parametro di $scope.$watch a true al fine di confrontare oggetto per l'uguaglianza, piuttosto che come riferimento. Si noti che questo può essere una brutta idea se l'oggetto è in realtà di grandi dimensioni:

$scope.$watch(
    'foo', 
    function (newFoo, oldFoo) { 
     // send old $scope.foo to server with the 
     // previous $scope.foo.bar and $scope.foo.baz 
    }, 
    true 
); 

è anche possibile guardare separatamente foo.bar e foo.baz:

var sendAndReplace = function (parameterName, oldParameter) { 
    oldFoo = angular.copy($scope.foo); 
    oldFoo[parameterName] = oldParameter; 

    // send old oldFoo to server with the 
    // previous oldFoo.bar oldFoo.baz 
}; 

$scope.$watch('foo.bar', function (newValue, oldValue)) { 
    sendAndReplace('bar', oldValue); 
}); 

$scope.$watch('foo.baz', function (newValue, oldValue)) { 
    sendAndReplace('baz', oldValue); 
}); 

Answer 2

La funzione listener che si fornisce ai $ la funzione watch ha due parametri newValue e oldValue come descritto nei documenti qui: http://docs.angularjs.org/api/ng.$rootScope.Scope#$watch

Nell'esempio si guarda sulla stringa concatenata, quindi per analizzare i vecchiValori dei nuovi valori devi mettere un separatore tra le due variabili in questo modo:

$scope.$watch('foo.bar + ";" + foo.baz', function(newValue, oldValue) { 
     var oldValues = oldValue.split(";"); 
     var oldBar = oldValues[0]; 
     var oldBaz = oldValues[1]; 
     console.log("oldBar="+oldBar); 
     console.log("oldBaz="+oldBaz); 
    });