角反应形式，ControlValueAccessor与PropertyBinding

Question

我有一些表单组件，实际上，它们只是将一个大公式的一些部分包装成小块。我可以想象这样做的两种方法:一个ControlValueAccessor或一个简单的PropertyBinding将FormControl传递给子组件。

超级简单-示例https://stackblitz.com/edit/angular-dt6pva

核心想法：

...
  providers: [
    {
      provide: NG_VALUE_ACCESSOR,
      multi: true,
      useExisting: forwardRef(() => Input01Component)
    }
  ]
})
export class Input01Component implements ControlValueAccessor  {
...

与

...
  @Input()
  control = new FormControl();
...

ControlValueAccessor-way感觉更“正确”，但也更“工作”。

问题:在使用更简单的FormControl-输入绑定时，有什么方面/优点/缺点吗？

编辑

考虑一下这个应该设计成表单的json结构。

{
    "id": 1,
    "name": "Leanne Graham",
    "username": "Bret",
    "email": "Sincere@april.biz",
    "address": {
      "street": "Kulas Light",
      "suite": "Apt. 556",
      "city": "Gwenborough",
    "company": {
      "name": "Romaguera-Crona",
      "catchPhrase": "Multi-layered client-server neural-net",
      "bs": "harness real-time e-markets"
    }

我将定义三个组件: PersonForm、AdressForm、CompanyForm

在我看来，有些人可能会补充一些我没有看到的优点/缺点：

格式控制-输入

• ++simpler子组件
• --使用的不同属性(我不能重复使用formControl
• )

ControlValueAccessor

作为所有其他输入组件的(formControlName)

• --"more，
• ++same的使用“是为了建立一个大型的表单定义。一方面，构建小型组件是一个很好的点，一般来说，我可以重用表单组件-部件。另一方面，我“松散”了数据结构的总体视图，数据结构可以直接发送到rest后端：

。

   peronForm = new FormGroup({
    id: new FormControl(),
    name: new FormControl(),
    username: new FormControl(),
    email: new FormControl(),
    address: new FormControl(), //>> handled by AdressComponent
    company: new FormControl() //>> handled by CompanyComponent
  });

到现在为止:不确定这是好是坏:)

谢谢你的帮助

Answer 1

场景是角反应形式，具有相当复杂的形式，组织在子部分。

这两种方法并不相同，而且有许多不同之处。

然而，基本的问题是:每个子形式是表示一个不可分割的值，还是一个适当的子形式？或者:您认为您可以对每个子表单的不同部分进行多重验证吗？

ControlValueAccessor内部发生的事情与FormControl/FormGroup无关:它是抽象的全部要点。因此，验证和值更改事件仅在ControlValueAccessor级别处理。

换句话说，当您必须管理单个值时，应该使用ControlValueAccessor，不管它的结构是什么(例如，代码/值对，以记录作为所选值的选择)。

如果您有一个字段集合(例如，用户的数据:名称、姓氏、ecc)，那么您正在查看一个子表单。然后，您应该更喜欢嵌套的FormGroup。

希望能帮上忙。