Угловой массив объектов для изменения данных

Я реализую корзину покупок и хочу хранить данные в localStorage. Я хочу посмотреть переменную $scope.cart для изменения, чтобы я мог обновить localStorage

Переменная корзины выглядит так:

[{'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 изменилась, но обновление не было запущено.

Ответы

Ответ 1

$watch оценивает только строку или параметр функции в своем первом аргументе. Измените $watch следующим образом:

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

ИЛИ

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

См. справочный API

Ответ 2

Это распространенная ошибка, что люди используют переменную в выражении watch. для $scope.cart вместо этого следует использовать строковое выражение 'cart'. Например,

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

У AngularJs есть новый метод наблюдения, $watchCollection. Это в основном то же самое, что и $watch с параметром равенства объекта, установленным в true, чтобы наблюдать за изменением свойства или элемента массива.

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

Вот ссылка на документ AngularJs для $watchCollection. http://docs.angularjs.org/api/ng/type/$rootScope.Scope. Синтаксис в основном такой же, как и $watch, за исключением того, что у него нет третьего параметра (проверка равенства объектов)

Ответ 3

попытайтесь изменить

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

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

$watch только оценивает строку или параметр функции в своем первом аргументе