1

我有一个带有如下代码的表单的 component.html:

<div *ngIf="client">
    //More divs
   <form class="form-horizontal" (ngSubmit)="onSubmit()" #clientForm="ngForm">
      <div>
         <input class="form-control" #name="ngModel" [(ngModel)]="client.name" required>
      </div>
    //End of more divs
   </form>
</div>

但是当组件呈现 html 时,我不断收到错误消息:

Uncaught (in promise): TypeError: undefined is not an object

只有当我将输入标签放在表单之间时才会发生这种情况。它应该在哪里。如果我将输入标签放在表单标签的上方和之前,它可以很好地处理数据。为什么会发生这种情况?

4

2 回答 2

2

您缺少name输入控件上的属性。应该

<input class="form-control" name="clientName" #name="ngModel" [(ngModel)]="client.name" required>

如果您删除 name 属性并打开控制台,您将看到如下错误消息:

如果在表单标签中使用 ngModel,则必须设置 name 属性,或者必须在 ngModelOptions 中将表单控件定义为“独立”。

这是一个Plunker

于 2017-01-30T23:48:53.737 回答
0

它不是关于放置我假设你没有定义对象client,因为你绑定到client.name;您必须初始化为默认值,例如

client = {}; 

在您的组件或真实客户对象中

PS。我想建议您停止使用 NGModel go with FormGroup。开始使用后,您会爱上它们 :) 快速、简单且灵活

于 2017-01-30T23:24:02.617 回答