Tür Denetimli Reaktif Formlar
Katı tür denetimiyle formlar oluşturun
Tür Denetimli Reaktif Formlar, CoddyKit'te ücretsiz bir Angular Academy dersidir. Bu, 4 dersinin 1. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Angular Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Angular Academy kursu toplamda 4 dersten oluşur.
Tür Güvenli Formlar Neden Kullanılır?
Angular 14'ten önce, reaktif form değerleri any türündeydi. Tür güvenli reaktif formlar tam tür güvenliği sağlar: derleyici, form değerinizin yapısını ve denetim adlarını bilir.
Tür Güvenli FormControl
Bir FormControl geneldir. Okuma ve yazma işlemlerinin denetlenmesi için değer türünü belirtin.
const name = new FormControl<string>('', {
nonNullable: true
});Tür Güvenli FormGroup
Bir FormGroup, değer türünü kendisine geçirdiğiniz denetimlerden çıkarır.
const form = new FormGroup({
email: new FormControl(''),
age: new FormControl(0)
});Çıkarılan Değer Türü
Yukarıdaki grubun value değeri { email: string | null; age: number | null } olarak türlendirilir ve tümü derleme zamanında denetlenir.
const v = form.value; // typed automaticallyNull Olabilirlik
Varsayılan olarak denetimler null değerine sıfırlanabilir; bu nedenle değer türleri | null içerir. Null değerini dışlamak için nonNullable kullanın.
new FormControl('', { nonNullable: true });
// value type: string (no null)Denetimlere Güvenli Erişim
form.controls.email güçlü biçimde türlendirilmiştir; bu nedenle denetim adlarındaki yazım hataları derleyici tarafından yakalanır.
form.controls.email.setValue('a@b.com');get ve controls Karşılaştırması
Tür güvenliği için form.get('name') yerine form.controls.name kullanmayı tercih edin; get, gevşek türlendirilmiş bir AbstractControl | null döndürür.
getRawValue
getRawValue(), devre dışı denetimler dâhil tüm değerleri döndürür. value ise devre dışı denetimleri dışarıda bırakır.
const all = form.getRawValue();İç İçe Gruplar
Tür güvenli gruplar birleştirilebilir. İç içe bir FormGroup, kendi tür güvenli yapısını üst grubun değerine ekler.
const form = new FormGroup({
user: new FormGroup({
first: new FormControl(''),
last: new FormControl('')
})
});patchValue Tür Güvenliği
patchValue, form değerinin kısmi bir yapısını kabul eder; bilinmeyen anahtarlar derleyici tarafından işaretlenir.
form.patchValue({ email: 'x@y.com' });Eski Formları Taşıma
UntypedFormGroup gibi türsüz API'ler kademeli geçiş için mevcuttur. Yeni kodlarda güvenlik için tür güvenli sınıfları kullanmalısınız.
Hızlı Kontrol
Tür güvenli reaktif formları anlayıp anlamadığınızı test edin.
Özet
Tür güvenli reaktif formların FormControl/FormGroup sınıflarını genel hâle getirerek denetlenen bir değer yapısı çıkardığını, varsayılanların | null içerdiğini (nonNullable ile önlenebilir) ve controls ile erişimin get kullanmaktan daha güvenli olduğunu öğrendiniz.
Sıkça Sorulan Sorular
“Tür Denetimli Reaktif Formlar” dersi ücretsiz mi?
Evet — “Tür Denetimli Reaktif Formlar” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Angular Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Angular Academy kursu toplamda 4 dersten oluşur.
“Tür Denetimli Reaktif Formlar” dersinde ne öğreneceğim?
Katı tür denetimiyle formlar oluşturun Angular Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.
Angular Academy öğrenmeye başlamak için deneyim gerekli mi?
Önceden deneyim gerekmez. CoddyKit'te Angular Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 1. dersidir.
“Tür Denetimli Reaktif Formlar” dersi ne kadar sürer?
Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.
Bu Angular Academy dersinde kod yazıp çalıştırabilir miyim?
Evet. Her Angular Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.
Bu kursun tüm dersleri
- Tür Denetimli Reaktif Formlar
- FormArray ve Dinamik Alanlar
- Eş Zamanlı Olmayan Doğrulayıcılar
- FormBuilder Kalıpları