Question

使用

选择验证时是否有任何首选方式

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，所以我们非常感谢专家意见。

Answer 1

就像您找到的内容一样，asset('/images/infotest/nameOfImage')旨在通过它FormGroup.get访问目标表单控件。并且它更常用于复杂（多层嵌入）情况，这使得从多层嵌入形式获得目标控件变得容易，并且使代码清晰且易于理解。

以下面的示例为例，您只需path而不是this.form.get('test.0')访问嵌入式FormArray的第一个元素：

this.form.controls.test.controls[0]

Answer 2

此问题与：Will using Angular Reactive Forms .get() method in template cause unnecessary method calls like a component method?。

在模板中，我更喜欢使用myForm.controls.name来避免进行myForm.get('name')函数调用。如果字段选择器非常复杂，那么我会将字段存储在component属性中，以便在模板中对其进行即时访问。

在控制器中使用一个或另一个应该没什么大不了的。

formGroup.get vs formGroup.controls in reactive form - Angular

2 个答案: