Isyarat dipautkan sudut

DDD
Lepaskan: 2024-11-25 14:57:11
asal
226 orang telah melayarinya

Angular  linkedSignal

Dalam Angular 19, ciri linkedSignal memperkenalkan pembolehubah reaktif yang kekal disegerakkan dengan logik yang dikira. Ini ialah penambahan hebat yang meningkatkan kereaktifan dan memudahkan pangkalan kod anda.

Cara LinkedSignal Berfungsi

LinkedSignal berfungsi dengan memperoleh nilainya daripada fungsi pengiraan yang disediakan. Begini cara ia beroperasi:

  1. Fungsi Pengiraan: Anda membekalkan fungsi kepada linkedSignal, dan hasilnya menjadi nilai linkedSignal.
  2. Auto-Kemas Kini: LinkedSignal secara automatik mengemas kini setiap kali input kepada pengiraan berubah.
  3. Kemas Kini Manual: Anda juga boleh menukar nilai linkedSignal secara manual.

Contoh Penggunaan

const shippingOptions = signal(['Ground', 'Air', 'Sea']);
const selectedOption = linkedSignal(() => shippingOptions()[0]);
Salin selepas log masuk

Langkah demi Langkah:

  1. Nilai Awal:
console.log(selectedOption()); // 'Ground'
Salin selepas log masuk

selectedOption bermula dengan 'Ground' kerana ia memaut ke item pertama dalam shippingOptions.

  1. Kemas Kini Manual:
selectedOption.set(shippingOptions()[2]);
console.log(selectedOption()); // 'Sea'
Salin selepas log masuk

Anda secara manual menetapkan Opsyen terpilih kepada 'Laut', iaitu pilihan ketiga dalam tatasusunan.

  1. Autokemas kini pada Perubahan Ketergantungan:
shippingOptions.set(['Email', 'Will Call', 'Postal service']);
console.log(selectedOption()); // 'Email'
Salin selepas log masuk

Apabila shippingOptions berubah, linkedSignal mengira semula. Kini, ia mencerminkan pilihan pertama baharu: 'E-mel'.

Berikut ialah contoh menggunakan LinkedSignal dengan fungsi pengiraan tersuai

Katakan anda ingin menguruskan suhu dalam kedua-dua Celsius dan Fahrenheit. LinkedSignal boleh digunakan untuk memastikan Fahrenheit dipautkan ke Celsius melalui fungsi tersuai.

const celsius = signal(25); // Base signal for temperature in Celsius
const fahrenheit = linkedSignal(() => celsius() * 9/5 + 32); // Compute Fahrenheit from Celsius
console.log(fahrenheit()); // 77 (25°C in Fahrenheit)
// Change the Celsius value
celsius.set(30);
console.log(fahrenheit()); // 86 (30°C in Fahrenheit)
// Manually update Fahrenheit (breaks auto-link temporarily)
fahrenheit.set(100);
console.log(fahrenheit()); // 100
console.log(celsius()); // Still 30, as Fahrenheit is overridden
// Change Celsius again to reset linkage
celsius.set(0);
console.log(fahrenheit()); // 32 (0°C in Fahrenheit)

Salin selepas log masuk

Mengapa Menggunakannya?

Kekalkan Keadaan Segerak: Memastikan Isyarat terpaut anda sentiasa sepadan dengan keadaan terkini pengiraannya.
Mudah: Anda tidak perlu mengemas kini linkedSignal secara manual apabila kebergantungannya berubah—ia mengemas kini secara automatik.
Fleksibel: Anda masih boleh menggantikan nilainya secara manual apabila diperlukan.

Bawa pulang kunci:

LinkedSignal mengikat nilainya dengan beberapa logik, jadi ia sentiasa dikemas kini secara automatik apabila logik berubah. Ia bagus untuk senario di mana satu negeri bergantung pada yang lain.

Atas ialah kandungan terperinci Isyarat dipautkan sudut. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan