How to apply formControlName to input?

Question

Angular

Good afternoon. I returned here to Angular and remembered that I hadn’t figured out the ControlValueAccessor in any way. The Custom Component
link generates code like this, where everything is applied directly to the component, not to
<ui-input-field>ng-valid ng-pristininput

<ui-input-field _ngcontent-c8="" formcontrolname="email" _nghost-c9="" ng-reflect-name="email" class="ng-untouched ng-pristine ng-valid">
<input _ngcontent-c9="">
<span _ngcontent-c9="" class="bar"></span>
<label _ngcontent-c9=""></label>
</ui-input-field>

As I understand it, for this reason, the transfer of formcontrolname to the component does not work (or I'm wrong).
How to apply it exactly to the input?

writeValue(value) {
    if (!value || typeof value !== 'string') {
      console.log('not value');
      return;
    }
  }


  onChange: any = () => {
  }
  onTouched: any = () => {
  }

  registerOnChange(fn) {
    this.onChange(fn);
  }
  registerOnTouched(fn) {
    this.onTouched(fn);
  }

Link

Answer 1

Based on your example - link . Example with ControlValueAccessor and added example with FromGroup (file input-control.component.ts )