Angular: No value accessor for form control with unspecified name attribute

Dung Do Tien Jun 21 2021 380

I have a small project with Angular 9. And I have a component as below:

@Component( {
    selector: 'switch-extra-field',
    template: `
            <div class="form-group" [formGroup]="formGroup" >
                <switch [attr.title]="field.etiquette" 
                    [attr.value]="field.valeur" [(ngModel)]="field.valeur"
                    [formControl]="fieldControl" [attr.id]="etiquette">
                </switch>
            </div>
    `
} )

When I run this component I got an error No value accessor for form control with unspecified name attribute.

ERROR Error: No value accessor for form control with unspecified name attribute
  at _throwError (forms.es5.js:1918)
  at setUpControl (forms.es5.js:1828)

How can I resolve it?

Have 2 answer(s) found.
  • M

    MSIIIXI Jun 21 2021

    You can try to use ngDefaultControl directive to make your form has default 2way binding.

    <switch [(ngModel)]="name" ngDefaultControl></switch>

    I hope it works for you.

  • Q

    Quoc Tin Nguyen Jun 21 2021

    I think the message error throw is very clear. you lost name attribute to the element has [ngModel]. To fix this issue, you can add more name="fieldName" ngDefaultControl to your element.

Leave An Answer
* NOTE: You need Login before leave an answer

* Type maximum 2000 characters.

* All comments have to wait approved before display.

* Please polite comment and respect questions and answers of others.

Popular Tips

X Close