Angular : résoudre l'erreur Error: No value accessor for form control with unspecified name attribute

Le framework Angular, créé par les équipes de Google, met à disposition un système entier pour créer le front-end d'un site entièrement avec le langage JavaScript. On peut notamment gérer les formulaires dynamiquement avec le framework, de manière à ce que les valeurs soient automatiquement récupérées. Si vous rencontrez le message d'erreur "Error: No value accessor for form control with unspecified name attribute" lorsque vous compilez votre application, c'est qu'il vous manque un élément dans les formulaires de votre application.

Le message d'erreur indique que vous n'avez pas implémenté de système permettant au framework d'accéder à la valeur de votre élément de formulaire. Cela peut notamment se produire si vous créez votre propre élément de formulaire. Lorsque vous utilisez une balise <input> ou <select> et que vous indiquez un nom à chacun de vos éléments, le framework récupère et peut contrôler leurs valeurs au fur et à mesure de leurs saisies. Pour cela, vous devez utiliser l'attribut "ngModel" dans votre élément.

<input type="text" id="monElement" class="form-control" name=" monElement" ngModel>

Vous pouvez ensuite récupérer les valeurs grâce à l'objet "Form" créé automatiquement par le framework

onSubmit(form: NgForm) {
    const monElement = form.value['monElement'];
}

Si vous souhaitez que votre élément puisse être lié au framework, vous devez ajouter l'attribut "ngDefaultControl". Cet attribut va ajouter le mécanisme de vérification par défaut à votre élément. Vous pourrez ainsi le contrôler ensuite dans votre code de validation.

<mon-element [(ngModel)]="monElement.name" ngDefaultControl><mon-element/>

AngularJS