web-dev-qa-db-fra.com

Angular2 - Comment définir la propriété `touched` du formulaire sur true

J'ai une forme réactive dans mon composant et je veux définir la propriété touched sur chacune des entrées égale à true. Mon code actuel fait cela, mais il renvoie l'erreur Cannot set property touched of #<AbstractControl> which has only a getter:

addressForm: FormGroup;

...

this.addressForm = this._fb.group({
    street: ["", [<any>Validators.required]],
    city: ["", [<any>Validators.required]],
    state: ["", [<any>Validators.required]],
    zipCode: ["", [<any>Validators.required]],
    country: ["", [<any>Validators.required]]
});

...

for (var key in this.addressForm.controls) {
    this.addressForm.controls[key].touched = true;
}

Comment puis-je définir la valeur touched de chaque entrée sur true?

16
georgej

Il existe une méthode assez simple pour ce faire: markAsTouched. Il devrait suffire de l'utiliser sur le groupe de formulaires.

this.addressForm.markAsTouched()

Si vous souhaitez, pour une raison quelconque, marquer tous les contrôles manuellement, ils ont eux-mêmes cette méthode disponible.

markAsTouched est une méthode de AbstractControl dont tous les éléments de formulaire héritent. Par curiosité, vous voudrez peut-être visiter le @angular/forms/src/model.d.ts fichier de déclaration pour trouver des méthodes plus intéressantes des objets de formulaire. Ou visitez simplement le documentation .

46
Mateusz Kocz

Si tu utilises #myForm="ngForm" sur votre élément de formulaire HTML, vous avez accès à myForm.submitted dans le code HTML, il est donc possible que vous n'ayez pas à vous soucier de .touched

0
Ron Newcomb