I created my custom component with a select and passed the control to it like this: <custom-select [formControl]="control"> </custom-select>
But this doesn’t work because Angular expects my component to implement the ControlValueAccessor interface for working with forms. As a result, I get the error: TypeError: Cannot read properties of null (reading 'writeValue').
To fix this error, I need to rename the parameter. For example, use customControl instead of formControl so Angular doesn’t automatically try to use ControlValueAccessor:
Fixed code:
1. In the template, I pass the control with a different name: <custom-select [customControl]="control"> </custom-select>
2. In the component, I change formControl to customControl: @Input() customControl: FormControl;
Now the error is gone because Angular no longer expects ControlValueAccessor for a component with the name customControl.