Angular Formlarında Özel Doğrulama

Angular uygulamalarınızda sağlam form doğrulaması sağlamak için özel doğrulayıcıları nasıl uygulayacağınızı öğrenin.

Özel Doğrulama Nedir?

Özel doğrulayıcılar, required veya minlength gibi yerleşik doğrulayıcıların ötesinde kendi doğrulama mantığınızı tanımlamanızı sağlar.

Özel Doğrulayıcı Oluşturma

Özel doğrulayıcı, geçerliyse null, geçersizse bir nesne döndüren basit bir işlevdir:

function forbiddenNameValidator(control: AbstractControl): { [key: string]: any } | null {
  return control.value === 'admin' ? { 'forbiddenName': true } : null;
}

Doğrulayıcıyı Uygulama

Özel doğrulayıcıyı form denetiminize uygulayın:

this.myForm = new FormGroup({
  username: new FormControl('', [forbiddenNameValidator])
});

Doğrulama Hatalarını Görüntüleme

Şablonunuzda doğrulama durumuna göre hata iletilerini koşullu olarak gösterin:

<div *ngIf="myForm.get('username').hasError('forbiddenName')">
  Username 'admin' is not allowed.
</div>

Doğrulayıcı Yönergelerini Kullanma

Doğrulayıcılar, şablon odaklı formlar için doğrudan yönerge olarak da kullanılabilir:

<input name="username" ngModel forbiddenName>

Eşzamansız Doğrulayıcılar

Eşzamansız doğrulayıcılar, sunucu kontrolleri gibi eşzamansız işlemler içeren doğrulamalar gerçekleştirmenizi sağlar:

username: new FormControl('', null, [asyncValidator])

Özel Doğrulayıcıları Test Etme

Farklı senaryolarda ve sınır durumlarında doğru çalıştıklarından emin olmak için doğrulayıcıları her zaman test edin.

Özet

Angular'da sağlam form doğrulaması için özel doğrulayıcılar oluşturmayı ve uygulamayı öğrendiniz. Mükemmel iş!