AngularJS - Unterschied zwischen makellos / schmutzig und berührt / unberührt

157

AngularJS Developer Guide - Formulare geben an , dass es viele Stile und Anweisungen in Bezug auf Formulare und Felder gibt. Für jede eine CSS-Klasse:

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

Was ist der Unterschied zwischen pristine/dirtyund touched/untouched?

angularjs

— Luis Masuelli
quelle

3

Dies finden Sie jetzt in der Dokumentation, auf die Sie verlinkt haben, unter der Überschrift "Verwenden von CSS-Klassen".

— Bernhard Hofmann

1

Du hast recht :) Der Gedanke scheint ein bisschen neu zu sein (neben den neuen Klassen, die er definiert)

— Luis Masuelli

219

AngularJS Developer Guide - Von AngularJS verwendete CSS-Klassen

@property {boolean} $ unberührt True, wenn die Steuerung den Fokus noch nicht verloren hat.

@property {boolean} $ touch True, wenn die Steuerung den Fokus verloren hat.

@property {boolean} $ pristine True, wenn der Benutzer noch nicht mit dem Steuerelement interagiert hat.

@property {boolean} $ dirty True, wenn der Benutzer bereits mit dem Steuerelement interagiert hat.

— Yuriy Rozhovetskiy
quelle

89

$pristine/ $dirtysagt Ihnen, ob der Benutzer tatsächlich etwas geändert hat, während $touched/ $untouchedIhnen sagt, ob der Benutzer lediglich dort war / besucht wurde .

Dies ist sehr nützlich für die Validierung. Der Grund dafür $dirtywar immer, dass keine Validierungsantworten angezeigt werden, bis der Benutzer tatsächlich ein bestimmtes Steuerelement besucht hat. Wenn Sie jedoch nur die $dirtyEigenschaft verwenden, erhält der Benutzer kein Validierungsfeedback, es sei denn, er hat den Wert tatsächlich geändert. Ein $invalidFeld würde dem Benutzer also immer noch keine Eingabeaufforderung anzeigen, wenn der Benutzer den Wert nicht geändert / mit ihm interagiert hätte. Wenn der Benutzer ein erforderliches Feld vollständig ignorierte, sah alles in Ordnung aus.

Mit Angular 1.3 und ng-touchedkönnen Sie jetzt einen bestimmten Stil für ein Steuerelement festlegen, sobald der Benutzer unscharf geworden ist, unabhängig davon, ob er den Wert tatsächlich bearbeitet hat oder nicht.

Hier ist ein CodePen , der den Unterschied im Verhalten zeigt.

— XML
quelle

Ich suche nach einer Möglichkeit, die Validierungsfehler des Formulars zu beheben. form. $ setPristine macht das nicht. Ich habe das Vorschlagsformular anderer gesehen. $ SetUntouched, aber es sieht so aus, als wäre dies in Angular 1.3 19 Beta, der von mir verwendeten Version, nicht verfügbar. Ich kann jedoch form.field_name. $ SetUntouched aufrufen, aber das für alle Felder zu tun ist mühsam. Gibt es einen besseren Weg?

— T. Rex

$setPristinemacht einfach die Form un- $dirty. Ich denke, Sie möchten vielleicht form.setValidity(). In diesem Beitrag finden Sie einige hilfreiche Antworten .

— XML

14

In Pro Angular-6 wird das Buch wie folgt detailliert beschrieben.

valid : Diese Eigenschaft gibt true zurück , wenn der Inhalt des Elements gültig ist, andernfalls false.
ungültig : Diese Eigenschaft gibt true zurück , wenn der Inhalt des Elements ungültig ist, andernfalls false.
pristine : Diese Eigenschaft gibt true zurück , wenn der Inhalt des Elements nicht geändert wurde.
Dirty : Diese Eigenschaft gibt true zurück , wenn der Inhalt des Elements geändert wurde .
unberührt : Diese Eigenschaft gibt true zurück , wenn der Benutzer das Element nicht besucht hat.
berührt : Diese Eigenschaft gibt true zurück , wenn der Benutzer das Element besucht hat.

— fgul
quelle

6

Es ist erwähnenswert, dass die Validierungseigenschaften für Formulare und Formularelemente unterschiedlich sind (beachten Sie, dass berührt und unberührt nur für Felder gelten):

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
quelle