我有以下表格：
import { Component } from '@angular/core'
@Component({
selector: 'form1',
template: `
<div >
<form (ngSubmit)="onSubmit(f)" #f="ngForm">
<input ngControl="email" type="text" id="mail" required>
<input ngControl="password" type="text" id="password" required>
<input ngControl="confirmPass" type="text" id="confirmPass" required>
<button type="submit">Submit </button>
</form>
</div> `
})
export class Form1Component{
onSubmit(form:any){
console.log(form.value);
}
}
问题是form.value只有一个空对象并且没有ngControl指令值的迹象。我错过了什么吗？
name在angular.io docs 中定义表单中的属性是一项要求：
在内部，Angular 创建 FormControl 实例并使用
NgFormAngular 附加到<form>标签的指令注册它们。每个FormControl都在您分配给name属性的名称下注册。
所以没有名字它不被认为是一个表单控件。我们还需要使用ngModel：
NgForm 指令用附加功能补充了表单元素。它保存您为具有
ngModel指令和name属性的元素创建的控件
总而言之，您的模板应如下所示：
<form (ngSubmit)="onSubmit(f)" #f="ngForm">
<input type="text" id="mail" name="email" ngModel required>
<input type="text" id="password" name="password" ngModel required>
<input type="text" id="confirmPass" name="confirmPass" ngModel required>
<button type="submit">Submit </button>
</form>
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句