implementing controlValueAccessor in multiple levels - Angular

i have a custom input that have more than 1 parent like:

mySimpleInputComponent -> mySpecialInputComponent

mySpecialInputComponent uses mySimpleInputComponent with some extra functionality.

since i want to use mySpecialInputComponent with a "formControlName" i implemented controlValueAccessor in both mySimpleInputComponent and mySpecialInputComponent and added in both of the components:

{
      provide: NG_VALUE_ACCESSOR,
      useExisting: forwardRef(() => CurrentComponent),
      multi: true
}

but after adding the formControlName to mySpecialInputComponent like:

 <mySpecialInputComponent formControlName="controlName"/>

i get an error:

vendor.js:37090 ERROR NullInjectorError: R3InjectorError(theModule)
[mySimpleInputComponent -> mySimpleInputComponent -> mySimpleInputComponent -> 
mySimpleInputComponent]: 
NullInjectorError: No provider for mySimpleInputComponent!

if i remove the formControlName from the template the error disappears are the providers sure be the way i put them?