如何从自定义组件中获取 ngModel？答案

【问题标题】：How to get ngModel from a custom component?如何从自定义组件中获取 ngModel？
【发布时间】：2021-06-24 08:50:03
【问题描述】：

我有一个带有自定义组件的表单

<app-custom-component [(ngModel)]="myValue"></app-custom-component>

在自定义组件中，我有一个输入，我也使用ngModel

<input [(ngModel)]="myValue" />

基本上myValue 绑定到自定义模型，同样的myValue 绑定到自定义模型内的输入。我希望输入的ngModel 的错误冒泡到自定义模型所在的表单。因此，在表单中，如果app-custom-component 模型无效，我将有一个保存按钮。

这甚至可能吗？如果有怎么办？

【问题讨论】：

【解决方案1】：

响应式表单可以解决这个问题。您可以将相同的FormControl 绑定到两个组件。 FormControl 本身包含验证错误和状态。

constructor(public FB: FormBuilder) { }

ngOnInit() {
   myControl = this.fb.control(myValue, /*validators and other configuration */);
}

<app-custom-component [formControl]="myControl"></app-custom-component>
<input [formControl]="myControl" />

【讨论】：