web-dev-qa-db-fra.com

formGroup.get vs formGroup.controls sous forme réactive - Angular

Existe-t-il un moyen privilégié lors de la sélection de la validation à l'aide de

  • myForm.controls['name'].valid
  • myForm.get('name').valid

car les deux ne semblent être que syntaxiquement différents mais atteignent le même objectif.

<label>Name
  <input type="text" formControlName="name">
</label>
<div class="alert" *ngIf="!myForm.controls['name'].valid && myForm.controls['name'].touched">
  {{ titleAlert }}
</div>

Pareil que

<div class="alert" *ngIf="!myForm.get('name').valid && myForm.get('name').touched">
  {{ titleAlert }}
</div>

D'après ce que j'ai vérifié dans le code, get a ce code:

AbstractControl.prototype.get = function (path) { return _find(this, path, '.'); };

Je viens de commencer Angular, alors un avis d'expert serait apprécié.

20
Samuel

Tout comme ce que vous avez trouvé, FormGroup.get Est conçu pour accéder au contrôle de formulaire cible par path. Et il est plus souvent utilisé dans des situations compliquées (multi layer embed), ce qui permet d’obtenir facilement le contrôle cible à partir d’un formulaire multicouche intégré et rend également le code clair et facile à comprendre.

Prenons ci-dessous, à titre d'exemple, vous pouvez simplement accéder au premier élément du FormArray incorporé par this.form.get('test.0') au lieu de this.form.controls.test.controls[0]:

this.form = this.formBuilder.group(
  {
    test: this.formBuilder.array(
      [
        ['form control 1 in form array'],
        ['form control 1 in form array'],
        ...
      ]
    )
  }
);
24
Pengyy