AngularJS form talimatı

Tanım ve Kullanım

AngularJS değiştirir <form> Elemanın varsayılan davranışı.

AngularJS uygulaması içindeki formlar bazı özelliklere sahiptir. Bu özellikler formun mevcut durumunu tanımlar.

Formun aşağıdaki durumları vardır:

  • $pristine Herhangi bir alan değiştirilmedi
  • $dirty bir veya daha fazla alan değiştirilmiştir
  • $invalid Form içeriği geçersiz
  • $valid Form içeriği geçerli
  • $subscribed Form gönderildi

Her durumun değeri bir boolean değer temsil eder, şu anki durumu true veya false.

Eğer action özelliği belirtilmemişse, AngularJS'teki form varsayılan işlemi engeller, yani formu sunucuya gönderir.

Örnek

Örnek 1

Gerekli giriş alanı boş olduğu sürece, bu formun "geçerli durum"u "true" olarak kabul edilmez:

<form name="myForm">
<input name="myInput" ng-model="myInput" required>
</form>
<p>Formun geçerli durumu:</p>
<h1>{{myForm.$valid}}</h1>

Kişisel olarak deneyin

Örnek 2

原始 (değiştirilmemiş) ve değiştirilmiş formlara stil uygula:

<style>
form.ng-pristine {
    background-color: lightblue;
}
form.ng-dirty {
    background-color: pink;
}
</style>

Kişisel olarak deneyin

gramer

<form name="formname</form>

kullanarak name değerini kullanarak formu referans almak için.

CSS Sınıfları

AngularJS uygulaması içindeki form bazı sınıflara sahiptir. Bu sınıflar, formun durumuna göre form stilleri ayarlamak için kullanılabilir.

aşağıdaki sınıflar eklendi:

  • ng-pristine değiştirilmemiş herhangi bir alan yok
  • ng-dirty bir veya daha fazla alan değiştirilmiştir
  • ng-valid Form içeriği geçerli
  • ng-invalid Form içeriği geçersiz
  • ng-valid-key her bir anahtarı tek tek doğrular. Örneğin:ng-valid-requiredbirden fazla zorunlu doğrulama olduğunda çok faydalıdır
  • ng-invalid-key örneğin:ng-invalid-required

değer temsil eden sınıfın falseise bu sınıflar silinecektir。