Pertanyaan AngularJS menonton berbagai objek untuk perubahan data


Saya menerapkan keranjang belanja dan ingin menyimpan data di localStorage. Saya ingin melihat variabelnya $scope.cart untuk perubahan sehingga saya dapat memperbarui localStorage

Variabel keranjang terlihat seperti ini:

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

Ini adalah kode untuk jam tangan.

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

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

Ini adalah HTML di mana pengguna mengubah model.

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

Dengan kode berikut, updateCart() metode tidak pernah dipicu. Saya tidak yakin apa yang saya lakukan salah. Saya memeriksa bahwa $scope.cart variabel memang berubah, tetapi pembaruan tidak dipicu.


33
2017-07-02 04:48


asal


Jawaban:


$watch hanya mengevaluasi parameter string atau fungsi dalam argumen pertamanya. Ubah-Mu $watch seperti ini :

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

ATAU

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

Lihat API referensi


37
2017-07-02 07:18



Ini adalah kesalahan umum bahwa orang menggunakan variabel dalam ekspresi jam. untuk $ scope.cart, Anda harus menggunakan ekspresi string 'keranjang' sebagai gantinya. Sebagai contoh,

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

AngularJs memiliki metode jam tangan baru, $ watchCollection. Ini pada dasarnya sama dengan $ jam dengan opsi persamaan objek diatur ke true untuk menonton perubahan dalam properti atau item array.

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

Berikut adalah tautan ke dokumen AngularJs untuk $ watchCollection. http://docs.angularjs.org/api/ng/type/$rootScope.Scope. Sintaksnya pada dasarnya sama dengan $ jam kecuali ia tidak memiliki parameter ketiga (pemeriksaan kesamaan objek)


25
2018-03-23 05:32



cobalah untuk berubah

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

untuk

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

$ watch hanya mengevaluasi parameter string atau fungsi dalam argumen pertamanya


0
2017-07-02 05:20