डेटा परिवर्तन के लिए ऑब्जेरजेएसएस एक्शन ऑब्जेक्ट्स

Question

मैं एक शॉपिंग कार्ट लागू कर रहा हूं और डेटा को स्थानीय स्टोरेज में स्टोर करना चाहता हूं। मैं इतना है कि मैं 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()); 

या

$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 के लिए, आपको इसके बजाय एक स्ट्रिंग अभिव्यक्ति 'कार्ट' का उपयोग करना चाहिए। उदाहरण के लिए,

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

AngularJS एक नई घड़ी विधि, $ watchCollection है। यह मूल रूप से एक संपत्ति या एक सरणी आइटम में परिवर्तन देखने के लिए ऑब्जेक्ट समानता विकल्प के साथ $ घड़ी के समान है।

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

$ घड़ी के चयन के लिए AngularJs दस्तावेज़ का लिंक यहां दिया गया है। http://docs.angularjs.org/api/ng/type/$rootScope.Scope। सिंटैक्स मूल रूप से $ घड़ी जैसा ही है, सिवाय इसके कि इसमें 3 पैरा (ऑब्जेक्ट समानता जांच)