Ada array objek dalam lingkup saya, saya ingin menonton semua nilai dari setiap objek.
Ini kode saya:
function TodoCtrl($scope) {
$scope.columns = [
{ field:'title', displayName: 'TITLE'},
{ field: 'content', displayName: 'CONTENT' }
];
$scope.$watch('columns', function(newVal) {
alert('columns changed');
});
}
Tapi ketika saya mengubah nilai-nilai, misalnya saya perubahan TITLE
untuk TITLE2
, yang alert('columns changed')
tidak pernah muncul.
Bagaimana cara mengamati objek di dalam array secara mendalam?
Ada demo langsung: http://jsfiddle.net/SYx9b/
angular.equals
ketika argumen ketiga mengambil nilai boolean ?$watchCollection
$watchCollection
hanya akan menonton "level pertama" dari array atau objek, seperti yang saya mengerti. Jawaban di atas benar jika Anda perlu menonton lebih dalam dari itu. bennadel.com/blog/…Ada konsekuensi kinerja untuk menyelam dalam suatu objek di $ watch Anda. Terkadang (misalnya, ketika perubahan hanya mendorong dan muncul), Anda mungkin ingin $ menonton nilai yang mudah dihitung, seperti array.length.
sumber
Jika Anda hanya akan menonton satu array, Anda dapat menggunakan sedikit kode ini:
contoh
Tetapi ini tidak akan berfungsi dengan banyak array:
contoh
Untuk menangani situasi ini, saya biasanya mengonversi banyak array yang ingin saya tonton menjadi JSON:
contoh
Seperti @jssebastian tunjukkan dalam komentar,
JSON.stringify
mungkin lebih disukaiangular.toJson
karena dapat menangani anggota yang mulai dengan '$' dan kemungkinan kasus lainnya juga.sumber
$watch
, apakah bisa melakukan hal yang sama?Pass true as a third argument to watch an object's properties too.
Lihat: cheatography.com/proloser/cheat-sheets/angularjsangular.toJson
pada satu array.Perlu dicatat bahwa dalam Angular 1.1.x dan di atasnya, Anda sekarang dapat menggunakan $ watchCollection daripada $ watch. Meskipun $ watchCollection tampaknya membuat arloji dangkal sehingga tidak akan berfungsi dengan array objek seperti yang Anda harapkan. Ia dapat mendeteksi penambahan dan penghapusan array, tetapi bukan properti objek di dalam array.
sumber
Berikut ini adalah perbandingan dari 3 cara Anda dapat menonton variabel lingkup dengan contoh:
$ watch () dipicu oleh:
$ watchCollection () dipicu oleh semua yang di atas DAN:
$ watch (..., true) dipicu oleh SEMUANYA di atas DAN:
HANYA SATU LAGI...
$ tonton () adalah satu-satunya yang memicu ketika array diganti dengan array lain bahkan jika array lain itu memiliki konten yang persis sama.
Misalnya di mana
$watch()
akan menembak dan$watchCollection()
tidak akan:Di bawah ini adalah tautan ke contoh JSFiddle yang menggunakan semua kombinasi arloji dan pesan log keluaran yang berbeda untuk menunjukkan "jam tangan" mana yang dipicu:
http://jsfiddle.net/luisperezphd/2zj9k872/
sumber
$ watchCollection menyelesaikan apa yang ingin Anda lakukan. Di bawah ini adalah contoh yang disalin dari situs web angularjs http://docs.angularjs.org/api/ng/type/$rootScope.Scope Meskipun nyaman, kinerja perlu dipertimbangkan terutama ketika Anda menonton koleksi besar.
sumber
Solusi ini bekerja sangat baik untuk saya, saya melakukan ini dalam arahan:
scope. $ watch (attrs.testWatch, function () {.....}, true);
yang sebenarnya berfungsi dengan sangat baik dan bereaksi untuk semua chnage (menambah, menghapus, atau memodifikasi bidang).
Ini adalah plunker yang berfungsi untuk bermain dengannya.
Sangat Menonton Array di AngularJS
Semoga ini bermanfaat bagi Anda. Jika Anda memiliki pertanyaan, jangan ragu untuk bertanya, saya akan mencoba membantu :)
sumber
Dalam kasus saya, saya perlu menonton layanan, yang berisi objek alamat juga ditonton oleh beberapa pengontrol lainnya. Saya terjebak dalam satu lingkaran sampai saya menambahkan parameter 'benar', yang tampaknya menjadi kunci keberhasilan ketika menonton objek.
sumber
Mengatur
objectEquality
parameter (parameter ketiga) dari$watch
fungsi jelas merupakan cara yang benar untuk menonton SEMUA properti array.Piran menjawab ini dengan cukup baik dan menyebutkan
$watchCollection
juga.Lebih detail
Alasan saya menjawab pertanyaan yang sudah dijawab adalah karena saya ingin menunjukkan bahwa jawaban wizardwerdna bukan jawaban yang baik dan tidak boleh digunakan.
Masalahnya adalah bahwa pencernaan tidak terjadi dengan segera. Mereka harus menunggu sampai blok kode saat ini selesai sebelum dieksekusi. Dengan demikian, menonton
length
array sebenarnya dapat melewatkan beberapa perubahan penting yang$watchCollection
akan ditangkap.Asumsikan konfigurasi ini:
Sekilas, sepertinya ini akan menyala pada saat yang sama, seperti dalam kasus ini:
Itu cukup berhasil, tetapi pertimbangkan ini:
Perhatikan bahwa panjang yang dihasilkan adalah sama meskipun array memiliki elemen baru dan kehilangan elemen, sehingga jam tangan yang
$watch
terkaitlength
tidak berubah.$watchCollection
mengambilnya, meskipun.Hasil yang sama terjadi dengan push dan pop di blok yang sama.
Kesimpulan
Untuk menonton setiap properti dalam array, gunakan a
$watch
pada array itu sendiri dengan parameter ketiga (objectEquality) disertakan dan disetel ke true. Ya, ini mahal tapi terkadang perlu.Untuk menonton saat objek masuk / keluar dari array, gunakan a
$watchCollection
.JANGAN gunakan
$watch
padalength
properti array. Hampir tidak ada alasan bagus yang bisa saya pikirkan untuk melakukannya.sumber
sumber