Angular 6：无法读取未定义的属性“ get”

Question

我正在使用Angular进行练习，尝试使用“内置验证器”时遇到问题。我尝试将表单字段的值作为参数传递，但是当我尝试执行此操作时，我只是看到标题为“无法读取未定义的属性'get'的未定义”的错误信息：

form.component.ts

this.form = new FormGroup({
      'name': new FormControl(this.name, [
        Validators.required,
        Validators.minLength(4),
        forbiddenNameValidator(this.name)
      ]),
      'alterEgo': new FormControl(this.alterEgo),
      'power': new FormControl(this.power, Validators.required)
    });

...更多代码...

get name(): string { return this.form.get('name').value };
get power(): string { return this.form.get('power').value };

当我尝试将forbiddenNameValidator（this.name）方法作为参数发送时，出现该错误。

form.component.html

<form [formGroup]="form" (ngSubmit)="Ver()">
<div class="form-group">
   <label for="name">Name</label>
   <input type="text" class="form-control" name="name" formControlName="name">
</div>
</form>

这是我得到的错误：

Answer 1

添加[formGroup]="form"到您的HTML表单

<div class="form-group" [formGroup]="form">
   <label for="name">Name</label>
   <input type="text" class="form-control" name="name" formControlName="name">
</div>

否则Angular将不知道将表单绑定到什么，这类似于formControlName="name"您需要为每个控件添加的内容。该form-group班纯粹是用于造型。