Angular js Formular zu Pristine false

Question

Ich habe ein HTML-Formular und ich bin Validierung hinzufügen, um jede Eingabe innerhalb der Verwendung von eckigen js.

Aber ich möchte den Validierungsfehler zunächst nicht anzeigen, wenn das HTML geladen wird, bis der Benutzer einige Änderungen in dem Formular vornimmt.

So habe ich die Validierung wie:

<form name="addApplicationForm" accept-charset="UTF-8" novalidate> 
    <input type="text" name="name" ng-model="applicationData.application_name" required> 
    <div ng-show="addApplicationForm.name.$invalid && !addApplicationForm.name.$pristine"> 
     <span class="error" ng-show="addApplicationForm.name.$error.required">Please enter application name.</span> 
    </div> 
    <button ng-click="submit()">Submit</button> 
</form> 

Und diese Form arbeitet als ich erwartet hatte. Wenn der Benutzer nun direkt auf die Schaltfläche "Senden" klickt, ohne Änderungen an der Eingabe vorzunehmen, ist der Status "$ pristine" immer noch gültig und der Fehler wird jetzt angezeigt. Aber hier möchte ich den Validierungsfehler dem Benutzer zeigen.

Aus diesem Grund möchte ich den substanziellen $ Status des Formulars auf false setzen, aber ich sehe keine Methode dafür.

ich auch mit $ schmutzig statt $ pristine wie versucht:

<form name="addApplicationForm" accept-charset="UTF-8" novalidate> 
    <input type="text" name="name" ng-model="applicationData.application_name" required> 
    <div ng-show="addApplicationForm.name.$invalid && !addApplicationForm.name.$dirty"> 
     <span class="error" ng-show="addApplicationForm.name.$error.required">Please enter application name.</span> 
    </div> 
    <button ng-click="submit()">Submit</button> 
</form> 

Und übermittle ich die setDirty Methode rufen Sie einfach das Formular schmutzig zu machen und so zeigt es den Fehler auf die Schaltfläche klicken Sie auf Absenden.

Aber hier ist das Problem, ich habe auch einen Reset-Knopf in der Form. Sobald ich geklickt habe, möchte ich alle Felder des Formulars löschen und dann muss ich die schmutzige Flagge des Formulars auf falsch setzen, aber ich habe keine solche Option. Aber für diesen Fall, wenn ich $ pristine verwende, habe ich $ setPristine().

Also in diesem Fall, was auch immer ich schmutzig oder $ unbereinigt verwende, habe ich ein Problem hier.

Bitte sagen Sie mir, was könnte die Lösung sein.

Answer 1

$ unberührte und $ dreckig sollten zusammen arbeiten. Mit $setPristine wird die $pristine Eigenschaft der Form auf True und $dirty auf false gesetzt. $setDirty wird das Gegenteil tun.

Es scheint, dass Ihr Problem mit der Tatsache zusammenhängt, dass Sie die Eigenschaften $pristine und $dirty eines Felds Ihres Formulars testen (siehe https://docs.angularjs.org/api/ng/type/ngModel.NgModelController). Doing $setPristine auf Ihrem Formular-Controller propagiert auch auf alle Felder des Formulars, während $setDirty nicht.

Sie einen Blick auf den Quellcode Winkel haben kann, wo die Eigenschaft festgelegt werden (#setPristine und #setDirty), dieser Code Teil explizit und leicht zu lesen ist: https://github.com/angular/angular.js/blob/master/src/ng/directive/form.js

Answer 2

In diesem speziellen Fall, Sie müssen Sie Ihren form zu nichts einstellen.

Sie müssen nur Ihr Scheck ändern:

<div ng-show="addApplicationForm.name.$invalid && addApplicationForm.name.$dirty"> 

ich Sie this Richtlinie zu verwenden, würde empfehlen.

Auch dies zu überprüfen tutorial.