当我将表单控件传递给孩子时，角度表单没有给出值访问器错误答案

【问题标题】：Angular forms give no value accessor error when I pass formcontrol to child当我将表单控件传递给孩子时，角度表单没有给出值访问器错误
【发布时间】：2019-04-24 10:33:16
【问题描述】：

为什么我得到一个错误“没有未指定名称的表单控件的值访问器”？

我有edit-component:

html

 <mat-form-field>
  <input [formControl]="formControl">
 </mat-form-field>

ts：

 @Input formControl;

在父组件（主编辑器）中：

html:

<edit-component [formControl]="data">

ts：

get data() {
 return this.form.get('data');
}

constructor(private fb: FormBuilder) {
 this.form = this.fb.group({ data: [''] });
}

【问题讨论】：

你试过吗？

标签： angular input angular-forms

【解决方案1】：

这是因为[formControl] 不能设置在edit-component 上。如果向组件添加响应式输入，则需要实现 NG_VALUE_ACCESSOR。

将<edit-component [formControl]="data"> 更改为<edit-component [myCustomFormControl]="data"> 和

<mat-form-field>
  <input [formControl]="myCustomFormControl">
 </mat-form-field>

【讨论】：

不起作用，因为 formcontrol 和 myCustomFormControl 只是一个名称。我该如何针对这个问题实施 NG_VALUE_ACCESSOR？
[formControl] 对组件而言，它不仅仅是一个名称。 edit-component 的 @Input() 字段必须不同于 formControl，例如 myCustomFormControl。
检查另一个答案中提供的链接stackblitz.com/edit/…，您将看到“编辑组件”的 [formControl] 已替换为 [control]

【解决方案2】：

在@Input() 装饰器中，我们不能提供formContolName 作为字符串。我们可以直接提供formControl，但请记住这个[AnyOtherName] 而不是[formControl]。

<form [formGroup]="form">
  <app-test [control]="form.controls.data"></app-test>
</form>

在链接上查看：

https://stackblitz.com/edit/angular-9kpk3i?file=src%2Fapp%2Ftest%2Ftest.component.html

【讨论】：