时间戳

首页 > 解决方案 > Error: Uncaught (in promise): Error: No value accessor for form control with name: 'firstname'

angular - Error: Uncaught (in promise): Error: No value accessor for form control with name: 'firstname'

问题描述

As i'm trying to use the template driven approach in angular 10 ionic to access the model which gives error on page load.

error

Now as i have used this approach in the HTML page as.

<form (ngSubmit)="onBookPlace()" #f="ngForm">
  <ion-grid>
    <ion-row>
      <ion-col size-sm="6" offset-sm="3">
        <ion-item>
          <ion-label position="floating">First Name</ion-label>
          <ion-text type="text" name="firstname" ngModel required></ion-text>
        </ion-item>
      </ion-col>
    </ion-row>
    <ion-row>
      <ion-col size-sm="6" offset-sm="3">
        <ion-item>
          <ion-label position="floating">Last Name</ion-label>
          <ion-text type="text" name="lastname" ngModel required></ion-text>
        </ion-item>
      </ion-col>
    </ion-row>
</ion-grid>
</form>

What am i missing here .. ?

Update 1:
It states here as well https://codecraft.tv/courses/angular/forms/template-driven/

标签： angularionic-frameworkionic5angular10angular-template-form

解决方案

您没有正确使用 2 向绑定。用于 2 路数据绑定的 sytex 涉及 Banana-in-box 语法 [(ngModel )] ="yourVariable"。

如果要将 firstName 和 lastName 的值绑定到组件变量，则需要遵循这种 2-way 绑定语法。

https://codecraft.tv/courses/angular/forms/template-driven/#_two_way_data_binding

推荐阅读