2
votes

I'm trying to pass the AbstractControl referenced by ngModel to an Input variable on another component.

According to this: https://angular.io/guide/form-validation#template-driven-validation (second bullet under the code snippet), #name="ngModel" exports NgModel into a local variable called name. NgModel mirrors many of the properties of its underlying FormControl instance, so you can use this in the template to check for control states such as valid and dirty

If I'm reading that correctly, I should be able to pass the FormControl (which inherits from AbstractControl) in the name Template Reference Variable to another component, something like this: <my-component for="name"></my-component> where in the MyComponent class for is an Input variable taking an AbstractControl. I should then be able to work with for as an AbstractControl.

I can't. When I debug, for is a string with the value "name".

Any ideas what I'm missing? My goal is to be able to centralize validation handling and display in MyComponent, so I need access to the AbstractControl (or FormControl) for whatever field I'm attempting to validate.

1

1 Answers

3
votes

You need square brackets for name to be parsed, so

<my-component [for]="name"></my-component>

Otherwise, it;s treated as a string/