AngularJS - bozulmamış / kirli ve dokunulmuş / dokunulmamış arasındaki fark

158

AngularJS Geliştirici Kılavuzu - Formlar , formlar ve alanlarla ilgili birçok stil ve yönerge olduğunu söyler. Her biri için bir CSS sınıfı:

ng-valid
ng-invalid
ng-pristine
ng-dirty
ng-touched
ng-untouched

Ne arasındaki fark var pristine/dirtyve touched/untouched?

angularjs

— Luis Masuelli
kaynak

3

Bu, artık bağlandığınız belgelerde "CSS sınıflarını kullanma" başlığı altındadır.

— Bernhard Hofmann

1

Haklısın :) Althought biraz yeni görünüyor (tanımladığı yeni sınıfların yanında)

— Luis Masuelli

221

AngularJS Geliştirici Kılavuzu - AngularJS tarafından kullanılan CSS sınıfları

@property {boolean} $ dokunulmaz Kontrol henüz odağı kaybetmediyse doğrudur.

@property {boolean} $, kontrol odağı kaybederse True değerine dokundu.

@property {boolean} $ pristine Kullanıcı henüz denetim ile etkileşime girmediyse doğrudur.

@property {boolean} $ dirty Kullanıcı denetim ile önceden etkileşime girdiyse doğrudur.

— Yuriy Rozhovetskiy
kaynak

89

$pristine/ $dirtysize kullanıcının gerçekten bir şey değiştirip değiştirmediğini söylerken $touched/ $untouchedsize yalnızca orada olup olmadığını / ziyaret edildiğini bildirir .

Bu gerçekten doğrulama için kullanışlıdır. Bunun nedeni $dirty, kullanıcı belirli bir denetimi ziyaret edene kadar doğrulama yanıtlarını göstermekten her zaman kaçınmaktı. Ancak, yalnızca $dirtyözelliği kullanarak , kullanıcı değeri gerçekten değiştirmedikçe doğrulama geri bildirimi alamaz. Dolayısıyla, $invalidalan değeri, kullanıcı değeri değiştirmediyse / etkileşimde bulunmadıysa kullanıcıya bir istem göstermez. Kullanıcı zorunlu bir alanı tamamen yok saydıysa, her şey yolunda görünüyordu.

Açısal 1.3 ve ile ng-touched, artık değeri bulanıklaştırıp düzenlemediğine bakılmaksızın, kullanıcı bulanıklaşır kalmaz kontrol üzerinde belirli bir stil ayarlayabilirsiniz.

İşte davranış farkı gösteren bir CodePen .

— XML
kaynak

Formun doğrulama hatalarını temizlemek için bir yol arıyorum. $ setPristine bunu yapmaz. Başkalarının öneri formunu gördüm. $ SetUntouched, ancak bu kullandığım sürüm olan açısal 1.3 19 beta'da mevcut değil gibi görünüyor. Ancak form.field_name. $ SetUnuchuched çağırabilir, ancak tüm alanlar için bunu yapmak külfetli, daha iyi bir yolu var mı?

— T. Rex

$setPristinesadece formu un- yapar $dirty. Bence isteyebilirsin form.setValidity(). Bu gönderide yararlı birkaç yanıta bakın .

— XML

14

Pro Angular-6 kitabında aşağıdaki gibi detaylandırılmıştır;

Geçerli : Bu özellik döndürür true ise öğenin içeriğini aksi geçerli ve yanlış.
invalid : Öğenin içeriği geçersiz, aksi halde false olursa bu özellik true değerini döndürür .
bozulmamış : Öğenin içeriği değiştirilmediyse bu özellik true değerini döndürür .
dirty : Öğenin içeriği değiştirildiyse bu özellik true değerini döndürür .
dokunulmamış : Kullanıcı öğeyi ziyaret etmediyse bu özellik true değerini döndürür .
dokunuldu : Kullanıcı öğeyi ziyaret ettiyse bu özellik true değerini döndürür .

— fgul
kaynak

6

Doğrulama özelliklerinin formlar ve form öğeleri için farklı olduğunu belirtmek gerekir (dokunulan ve dokunulmayanların yalnızca alanlar için olduğunu unutmayın):

Input fields have the following states:

$untouched The field has not been touched yet
$touched The field has been touched
$pristine The field has not been modified yet
$dirty The field has been modified
$invalid The field content is not valid
$valid The field content is valid

They are all properties of the input field, and are either true or false.

Forms have the following states:

$pristine No fields have been modified yet
$dirty One or more have been modified
$invalid The form content is not valid
$valid The form content is valid
$submitted The form is submitted

They are all properties of the form, and are either true or false.

— Yvonne Aburrow
kaynak