Angular Reactive Forms: Wie man den Zustand des Formulars zurücksetzt und Werte nach dem Einreichen behält

Question

In einer angularen reaktiven Form. Wie wird nur der Zustand des Formulars nach erfolgreichem Senden zurückgesetzt?

Hier ist der Prozess:

• das Formular erstellen und setValue von Service Ergebnis
• Ändern Werte und senden Sie das Formular
• Wenn Formular ordnungsgemäß Dienst gestellt wird, dann zurückgesetzt und halten Werte

Wie Sie Werte als geändert beibehalten und das Formular in den ursprünglichen Zustand zurücksetzen.

Eine form.reset() einfach das Formular leeren. Aber wenn ich es nicht nenne, wird der Zustand nicht zurückgesetzt und zum Beispiel sind meine Validierungen, die von den Formzustandsklassen (unberührte, schmutzige, gültige usw.) abhängig sind, immer noch da.

Answer 1

Die Lösung von @smnbbrv ziemlich gut funktioniert.

Sie können auch Ihren tatsächlichen Formularwert der reset() -Methode bereitstellen.

Angesichts der Tatsache myReactiveForm ist ein reaktives Formular in Ihrer Komponente. Nach erfolgreichem Ihrem Formular (durch einen Dienst zum Beispiel Aufruf), dann können Sie Ihre tun:

this.myReactiveForm.reset(this.myReactiveForm.value); 

wird das Formular aus und legen Sie es zurücksetzen, um die „neuen“ Form Werte auf den gleichen Wert, der Sie hatte bilden. Allerdings D, I:

Diese Methode kann in Tour of Held Beispiel sehen wird Official Angular.io doc

Answer 2

so ziemlich einfach ist:

this.form.markAsPristine(); 
this.form.markAsUntouched(); 

Dadurch wird die Form von Metadaten und die Form pristine ist wieder