Angular:ControlValueAccessor vs @Input - 什么时候用表单？

Question

ControlValueAccessors 在过去几个月突然出现在我面前，我对为什么或何时应该使用它们而不是使用 @Input 感到有些困惑。用我的 react 形式。
这是迄今为止我如何使用响应式(Reactive)表单的示例代码:

@Component({
 selector: 'app-my-component',
 template: `<input [formControl]="form.get('specificControlName')"  />` 
 // or the alternative method of [formGroup]="form" and formControlName="specificControlName"
})
export class MyComponent {
 @Input() form: FormGroup; // passed in formGroup

 ngOnInit() {
  form.valueChanges.pipe(
   // do rxjs magic here
  ).subscribe(value => {
   // do something with the value
  })
 }
}

响应式表单保存表单的状态，因此我甚至可以从父组件访问该状态。我也可以访问所有不同的 NgControl属性如 valid , disabled , dirty , 和 touched .
ControlValueAccessors 提供了什么，而这种使用响应式(Reactive)表单的方式没有提供？以及 ControlValueAccessors 比 @Input 更好地工作的一些用例是什么？和 @Output一般来说？
编辑 :
https://medium.com/angular-in-depth/angular-nested-reactive-forms-using-cvas-b394ba2e5d0d
在本文中，作者提到了以下主要区别:

Three Ways to implement nested forms:

...

2. By passing a handle of the FormGroup to child components via Input and referencing it in child templates. There are couple of good tutorials on it.

But the con of using this approach is that you are tightly binding the parent form group with that of child group.

3. Using Composite CVAs.

Pros: Highly Reusable, Portable. Better Encapsulation(Internal Form Controls of the component doesn’t necessarily need to be visible to parent components). This is best used when you have more number of form modules which is typically a large project.

Cons: Need to implement CVA interface results in boilerplate code.

这很有趣，但它引发了更多问题:为什么以及何时不希望您的内部表单控件对父级可见？便携是什么意思？
还:

import { Component, OnInit } from '@angular/core';
import { ControlValueAccessor,NG_VALUE_ACCESSOR, NG_VALIDATORS, FormGroup,FormControl, Validator, Validators,AbstractControl, ValidationErrors } from "@angular/forms";

@Component({
  selector: 'app-address-info',
  templateUrl: './address-info.component.html',
  styleUrls: ['./address-info.component.css']
})
export class AddressInfoComponent implements OnInit, ControlValueAccessor {

public addressForm: FormGroup = new FormGroup({
  addressLine: new FormControl("",[Validators.required]),
  areacode: new FormControl('', [Validators.required, Validators.maxLength(5)])
});
  constructor() { }
  ngOnInit() {
  }

  public onTouched: () => void = () => {};

  writeValue(val: any): void {
    val && this.addressForm.setValue(val, { emitEvent: false });
  }
  registerOnChange(fn: any): void {
    console.log("on change");
    this.addressForm.valueChanges.subscribe(fn);
  }
  registerOnTouched(fn: any): void {
    console.log("on blur");
    this.onTouched = fn;
  }
  setDisabledState?(isDisabled: boolean): void {
    isDisabled ? this.addressForm.disable() : this.addressForm.enable();
  }
}

当你通过 FormGroup成 ControlValueAccessor作者正在初始化一个新的组件 FormGroup与传入的对象具有相同结构的组件内部。直接传入 FormGroup 不是更好吗？本身呢？或者封装提供了什么好处？
EDIT2:这是一个关于这个主题的有趣视频:
https://www.youtube.com/watch?v=CD_t3m2WMM8

Answer 1

Use Standard Reactive Form API whenever you are using native HTML elements (input, select, button, form, etc)

Use ControlValueAccessor for example when you have to work with custom HTML elements (i.e. mat-list, mat-table, ag-grid-table, etc), the reason is because it's an interface that acts as a bridge between Angular forms API and DOM elements. ControlValueAccessor example