Angular2: Comment avez-vous marque FormGroup contrôle sale via `patchValue()`

Je me suis mise à jour d'un Réactif FormGroup de contrôle de la valeur de mon composant via patchValue.

Ex:

this.myForm.patchValue({incidentDate:'2016-09-12');

Cela fonctionne très bien et déclenche une valueChanges cas, cependant, ce contrôle est dirty propriété est encore false.

J'ai besoin de la incidentDate contrôle dirty donc ma logique de validation sait à l'encontre de ce contrôle.

Comment puis-je mettre à jour la valeur d'un contrôle de mon composant ET indiquent que c'est sale?

Voici ma logique de validation:

onValueChanged(data?: any) {
    if (!this.myForm) {
      return;
    }
    const form = this.myForm;
    for (const field in this.formErrors) {
      //clear previous error message (if any)
      this.formErrors[field] = '';
      const control = form.get(field);
      if (control && control.dirty && !control.valid) {
        const messages: any = this.validationMessages[field];
        for (const key in control.errors) {
          this.formErrors[field] += messages[key] + ' ';
        }
      }
    }
}

OriginalL'auteur rynop | 2016-10-01

  1. 31

    J'ai l'habitude de le faire:

    this.formControl.markAsDirty()

    Ou dans votre cas, il pourrait être:

    this.myForm.get('incidentDate').markAsDirty()
    Toi, mon ami, êtes l'homme. Curieux, où avez-vous trouver ce document? C'est pas de l'endroit où se trouve dans angulaire.io/docs/ts/latest/api/formes/index/...
    Je viens ici assez régulièrement github.com/angular/angular/blob/master/modules/%40angular/forms/... lol
    J'aime quand les gens me prennent directement dans le code source.
    ... mais le lien est cassé maintenant.
    J'ai besoin d'ajouter ajouter un appel à this.formControl.updateValueAndValidity() après la markAsDirty() pour le faire fonctionner.

    OriginalL'auteur Harry Ninh

  2. 1

    Si vous avez un groupe ou un tableau que vous avez besoin de marquer comme sale, vous pouvez utiliser cette

    export class Helpers {
/**
   * Loop and touch all it has
   *
   * @param {FormGroup} formGroup
   * @param func << function name: [markAsTouched, markAsUntouched, markAsDirty, markAsPristine, markAsPending
   * @param opts
   *
   */
  public static touchAll(formGroup: FormGroup|FormArray, func = 'markAsDirty', opts = {onlySelf: false}): void {
    mapValues(formGroup.controls, (c, i) => {
      if (c instanceof FormGroup || c instanceof FormArray)
        Helpers.touchAll(c, func, opts);
      else
        c[func](opts);
    })
  }
}

    Vous pouvez utiliser le SuperForm package npm le faire pour vous.

    OriginalL'auteur Pian0_M4n