时间戳

首页 > 解决方案 > 在表单标签中使用带有 ngModel 的 name 属性，仍然出现错误 -“如果在表单标签中使用 ngModel，则必须设置 name 属性...”

html - 在表单标签中使用带有 ngModel 的 name 属性，仍然出现错误 -“如果在表单标签中使用 ngModel，则必须设置 name 属性...”

问题描述

以下是我的html：

<div class="form-row">
  <div class="form-group col-md-3">
    <input [(ngModel)]="model.adminVerificationEndDate" name="adminVerificationEndDate" 
           type="text" autocomplete="off" class="form-control form-control-sm"
           [bsConfig]="datePickerConfig" bsDatepicker [minDate]="currentDate" required/>
  </div>
</div>

我已经初始化了我的 ts 文件中使用的所有变量。我已经使用 ngModel 在表单标签中绑定了模型属性，我还使用了 name 属性。

但仍然出现错误 -如果在表单标记中使用 ngModel，则必须设置名称属性或必须在 ngModelOptions 中将表单控件定义为“独立”。

我在这里缺少什么？

我还附上了我的控制台抛出该错误的屏幕截图。

在控制台上显示错误

产生错误的代码行

任何形式的帮助/建议表示赞赏。

标签： htmlangularformsangular-ngmodel

解决方案

你使用的代码，

<div class="form-row">
   <div class="form-group col-md-3">
      <input [(ngModel)]="model.adminVerificationEndDate" name="adminVerificationEndDate"
       type="text" autocomplete="off" class="form-control form-control-sm"
       [bsConfig]="datePickerConfig" bsDatepicker [minDate]="currentDate" required/>
   </div>
</div>

您已在此表单标签中添加了 name 属性，但仍然显示错误。因此，您可能有另一个没有任何名称属性的表单标签。

但问题出在控制台中，它会显示第一个表单标签的行号，是的，这很令人困惑。

要正确理解这一点，请参阅此答案。

所以，特别是在你的情况下，

在此处输入图像描述 请查看控制台错误的最后一行。它表示第 140 行。

所以，我假设第 123 行没问题（绿色框）。

你可能忽略了那条线。如果有任何名称属性，请检查 html 的第 140 行。

推荐阅读