Steuerelemente mit deaktiviertem Winkel 2 werden nicht in den form.value aufgenommen

110

Ich habe festgestellt, dass das Steuerelement nicht in den form.value aufgenommen wird, wenn ich ein Steuerelement in einem reaktiven Angular 2-Formular deaktiviere. Zum Beispiel, wenn ich mein Formular wie folgt definiere:

this.notelinkingForm = new FormGroup({
    Enabled: new FormControl(settings.Enabled, Validators.required),
    LinkToPreceeding: new FormControl({value: settings.LinkToPreceeding, disabled: !settings.Enabled}, Validators.required),
    LinkingTolerance: new FormControl({value: settings.LinkingTolerance, disabled: !settings.Enabled}, Validators.required)
});

und überprüfen Sie den Wert this.notelinkingForm.value. Wenn alle Steuerelemente aktiviert sind, lautet die Ausgabe wie folgt:

{"Enabled":true, "LinkToPreceeding": true, LinkingTolerance:"100"}

Wenn jedoch einige der Steuerelemente deaktiviert sind, ist dies:

{"Enabled":true}

Beachten Sie, wie die deaktivierten Steuerelemente ausgeschlossen werden.

Wenn sich das Formular ändert, möchte ich in der Lage sein, den form.value mit allen darin enthaltenen Eigenschaften an meine Rest-API zu übergeben. Dies ist offensichtlich nicht möglich, wenn die deaktivierten Elemente nicht enthalten sind.

Vermisse ich hier etwas oder ist dies das erwartete Verhalten? Gibt es eine Möglichkeit, Angular anzuweisen, die deaktivierten Elemente in den form.value aufzunehmen?

Begrüße deine Gedanken.

angular angular2-forms Jim Culverwell
quelle

Antworten:

241

Sie können verwenden:

this.notelinkingForm.getRawValue()

Aus Dokumenten :

Wenn Sie alle Werte unabhängig vom deaktivierten Status einschließen möchten, verwenden Sie diese Methode. Andernfalls ist die valueEigenschaft der beste Weg, um den Wert der Gruppe zu ermitteln.

Sasxa
quelle
40
Ich frage mich, warum um alles in der Welt das Angular-Team dies getan hat
anorganik
@inorganik Sie haben es getan, weil es möglich ist, ein deaktiviertes Steuerelement zu aktivieren und seinen Wert zu bearbeiten. In diesem Fall gibt getRawValue () ein Objekt mit dem manipulierten Wert zurück.
Dänisch
Das ist eigentlich eine gute Sache. Ich weiß beispielsweise, dass sich die Werte meiner deaktivierten Steuerelemente nicht ändern werden, daher möchte ich sie nicht in die Speicher-API aufnehmen, da ich diesen Steuerelementen zunächst einen Wert aus der Datenbank zugewiesen habe. In einigen Fällen möchte ich jedoch tatsächlich die Steuerelemente einbeziehen, denen die Werte vom Front-End zugewiesen wurden und die nicht in der Datenbank gespeichert sind und die von dieser Funktion abgedeckt werden. Es ist immer gut, beide Optionen zu haben.
ChiragMS
9

Eine andere Option, die ich benutze, ist:

this.form.controls['LinkToPreceeding'].value;

Luis Ricardo Cayetano Herrera
quelle
7

Vielen Dank an @Sasxa, dass Sie mir 80% das gebracht haben, was ich brauchte.

Für diejenigen unter Ihnen, die nach einer Lösung für dasselbe Problem suchen, aber für verschachtelte Formulare, die ich lösen konnte, indem ich meine üblichen geändert habe 

this.notelinkingForm.get('nestedForm').value

zu 

this.notelinkingForm.getRawValue().nestedForm
eper
quelle