Mengemas Kini Isyarat dengan set dan update
Ubah nilai isyarat secara reaktif.
Mengemas Kini Isyarat dengan set dan update ialah pelajaran Angular Academy percuma di CoddyKit. Ini ialah pelajaran 3 daripada 4. Sebanyak 3 pelajaran dalam laluan pembelajaran ini boleh dibaca sepenuhnya secara percuma — selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan praktikal dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Angular Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Angular Academy merangkumi sejumlah 4 pelajaran.
Mengubah Signal
Signal boleh tulis boleh diubah melalui dua cara: set() untuk menggantikan nilai dan update() untuk mendapatkan nilai baharu daripada nilai semasa.
Menggunakan set()
set(newValue) menggantikan nilai signal sepenuhnya dengan nilai yang anda berikan.
const c = signal(0);
c.set(1);
console.log(c()); // 1Bila Hendak Menggunakan set()
Gunakan set() apabila nilai baharu tidak bergantung pada nilai lama, contohnya apabila menetapkan nilai baharu daripada input pengguna atau respons API.
const name = signal('');
name.set('Alice');
console.log(name()); // AliceMenggunakan update()
update(fn) menerima fungsi yang mendapatkan nilai semasa dan mengembalikan nilai baharu. Fungsi ini sesuai apabila nilai seterusnya bergantung pada nilai sebelumnya.
const c = signal(0);
c.update(v => v + 1);
console.log(c()); // 1Menambah dengan update()
Pembilang klasik menggunakan update() untuk menambah nilai berdasarkan kiraan sedia ada.
const count = signal(10);
count.update(v => v + 1); // 11
count.update(v => v - 1); // 10Mengemas Kini Objek Secara Tidak Boleh Ubah
Oleh sebab pengesanan perubahan membandingkan rujukan, gantikan objek dan bukannya mengubahnya. Salin nilai lama ke dalam objek baharu menggunakan operator sebaran.
const point = signal({ x: 0, y: 0 });
point.update(p => ({ ...p, x: p.x + 1 }));
console.log(point()); // { x: 1, y: 0 }Mengemas Kini Tatasusunan Secara Tidak Boleh Ubah
Untuk tatasusunan, kembalikan tatasusunan baharu. Elakkan push/splice pada tatasusunan sedia ada; gunakan operator sebaran atau kaedah tatasusunan yang mengembalikan tatasusunan baharu.
const items = signal<string[]>(['a']);
items.update(arr => [...arr, 'b']);
console.log(items()); // ['a', 'b']Ringkasan set() berbanding update()
set: anda sudah mempunyai nilai akhir. update: anda mengira nilai akhir berdasarkan nilai semasa. Kedua-duanya memaklumkan pengguna jika nilai benar-benar berubah.
Kesamaan Rujukan dan Perubahan
Secara lalai, signal menggunakan kesamaan rujukan (atau kesamaan nilai bagi primitif) untuk menentukan sama ada sesuatu telah berubah. Menetapkan signal kepada nilai primitif yang sama tepat tidak akan memaklumkan kebergantungan.
const c = signal(5);
c.set(5); // no change, dependents not notifiedPengubahan Tidak Digalakkan
API terdahulu mempunyai kaedah mutate(), tetapi pendekatan moden yang disyorkan ialah kemas kini tidak boleh ubah dengan set() dan update() yang mengembalikan rujukan baharu.
Mengemas Kini Signal dalam Kaedah
Dalam komponen, bungkus kemas kini signal dalam kaedah yang boleh dipanggil oleh templat daripada pengendali peristiwa.
export class CounterComponent {
count = signal(0);
increment() { this.count.update(v => v + 1); }
reset() { this.count.set(0); }
}Semakan Pantas: set berbanding update
Pilih alat yang tepat untuk tugas tersebut.
Imbas Kembali: Mengemas Kini Signal
Anda telah mempelajari set() untuk menggantikan nilai dan update(fn) untuk mendapatkan nilai baharu daripada nilai semasa. Anda juga telah melihat cara mengemas kini objek dan tatasusunan secara tidak boleh ubah supaya kesamaan rujukan dapat mengesan perubahan. Seterusnya: menggunakan signal secara terus dalam templat.
Pelajari HTML dengan tutor kecerdasan buatan — percuma
Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.
- Kursus
- 38
- Pelajaran
- 144
Soalan Lazim
Adakah pelajaran “Mengemas Kini Isyarat dengan set dan update” percuma?
Ya — sebanyak 3 pelajaran dalam laluan pembelajaran Angular Academy, termasuk “Mengemas Kini Isyarat dengan set dan update”, boleh dibaca sepenuhnya secara percuma di web ini. Selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan interaktif dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Kursus Angular Academy merangkumi sejumlah 4 pelajaran.
Apakah yang akan saya pelajari dalam “Mengemas Kini Isyarat dengan set dan update”?
Ubah nilai isyarat secara reaktif. Anda berlatih Angular Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.
Adakah saya memerlukan pengalaman untuk memulakan Angular Academy?
Tiada pengalaman terdahulu diperlukan. Pembelajaran Angular Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 3 daripada 4.
Berapa lamakah pelajaran “Mengemas Kini Isyarat dengan set dan update” diambil?
Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.
Bolehkah saya menulis dan menjalankan kod dalam pelajaran Angular Academy ini?
Ya. Setiap pelajaran Angular Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.
Semua pelajaran dalam kursus ini
- Apakah Isyarat
- Mencipta dan Membaca Isyarat
- Mengemas Kini Isyarat dengan set dan update
- Isyarat dalam Templat