AngularJSのデータ変更用オブジェクト配列

Question

私はショッピングカートを実装していて、そのデータをlocalStorageに保存したいと考えています。 私はカートの変数は次のようになりますのlocalStorage

を更新できるように変更するための変数$scope.cartを見たい：

[{'name':'foo', 'id':'bar', 'amount': 1 },...] 

これは、時計用のコードです。

$scope.updateCart = function(){ 
    localStorageService.add('cart',JSON.stringify($scope.cart)); 
    alert('cart updated'); 
}; 

$scope.$watch($scope.cart, $scope.updateCart(), true); 

これは、ユーザーがモデルを変更するHTMLです。

<li ng-repeat="item in cart"> 
    {{item.name}} <input type="text" ng-model="item.amount"> 
</li> 

次のコードでは、updateCart()メソッドは実行されません。私は何が間違っているのか分かりません。私は$scope.cart変数が変更されたことを確認しますが、更新はトリガーされませんでした。

Answer 1

$watchのみ最初の引数の文字列または関数のパラメータを評価する最初の引数に文字列または関数パラメータの評価に変更してみてください。このようなあなたの$watchを変更します。

$scope.$watch('cart.name + cart.id + cart.amount', $scope.updateCart()); 

OR

$scope.$watch('cart', $scope.updateCart, true); 

それは、人々がウォッチ式で変数を使用することを一般的な間違いだ reference API

Answer 2

は

$scope.$watch($scope.cart, $scope.updateCart(), true); 

へ

$scope.$watch('cart', $scope.updateCart(), true); 

$しか見

Answer 3

を参照してください。 $ scope.cartの場合は、代わりに文字列式 'cart'を使うべきです。例えば、

$scope.$watch('cart', function() {...}, true) 

AngularJsは、新しい時計の方法、$ watchCollectionを持っています。基本的に$ watchと同じですが、オブジェクト等価オプションをtrueに設定すると、プロパティまたは配列項目の変更を監視できます。

$scope.$watchCollection('cart', function() {...}); 

ここに、$ watchCollectionのAngularJs docへのリンクがあります。 http://docs.angularjs.org/api/ng/type/$rootScope.Scope。構文は基本的に$ watchと同じですが、3番目のパラメータ（オブジェクト等価チェック）がないこと以外は