Angulaire 2: Itération sur le réactif de contrôles de formulaire

Question

Je voudrais markAsDirty tous les contrôles à l'intérieur d'un FormGroup.

Answer 1

Découvert qu' Object.keys pouvez gérer cela..

Object.keys(this.form.controls).forEach(key => {
  this.form.get(key).markAsDirty();
});

Answer 2

Pour ce que ça vaut, il y a une autre façon de le faire sans avoir à utiliser d'Objet.les touches(...) la magie:

for (const field in this.form.controls) { // 'field' is a string

   const control = this.form.get(field); // 'control' is a FormControl

}

Answer 3

L'on a accepté la réponse est correcte pour une plate forme de structure, mais ne permet pas de répondre entièrement à la question d'origine. Une page web peut exiger imbriquée FormGroups et FormArrays, et nous devons tenir compte de cela pour créer une solution robuste.

public markControlsDirty(group: FormGroup | FormArray): void {
    Object.keys(group.controls).forEach((key: string) => {
        const abstractControl = group.controls[key];

        if (abstractControl instanceof FormGroup || abstractControl instanceof FormArray) {
            this.markControlsDirty(abstractControl);
        } else {
            abstractControl.markAsDirty();
        }
    });
}

Answer 4

À l'aide de @Marcos réponse, j'ai créé une fonction qui peut être appelée le passage d'un formGroup comme paramètre, et c'est la marque de chaque formGroup enfants contrôles sale, juste pour le rendre utilisable à partir de plusieurs endroits dans le code de la mettre à l'intérieur d'un service, par exemple.

public touchAllFormFields(formGroup: FormGroup): void {
    Object.keys(formGroup.controls).forEach((key) => {
        formGroup.get(key).markAsDirty();
    });
}

j'espère que ça aide ;)

Answer 5

    Object.keys( this.registerForm.controls).forEach(key => {
       this.registerForm.controls[key].markAsDirty();
    });