web-dev-qa-db-ja.com

リアクティブフォームのformGroup.get vs formGroup.controls-Angular

を使用して検証を選択するときに好ましい方法はありますか

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

両方は構文的に異なるだけのようですが、同じ目標を達成しています。

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

と同じ

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

コードでチェックしたものから、getには次のコードがあります。

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

私はAngularを始めたばかりなので、専門家の意見をいただければ幸いです。

20
Samuel

見つけたものと同じように、_FormGroup.get_はpathによってターゲットformcontrolにアクセスするように設計されています。また、複雑な(multi layer embed)状況でよく使用されます。これにより、ターゲットコントロールをmulti embedフォームから簡単に取得できるようになり、コードが明確になり、理解しやすくなります。

例として、this.form.controls.test.controls[0]_の代わりにthis.form.get('test.0')によって埋め込みFormArrayの最初の要素に単純にアクセスできます:

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