提示:本站收集StackOverFlow近2千万问答，支持中英文搜索，鼠标放在语句上弹窗显示对应的参考中文或英文， 本站还提供 中文繁体 英文版本 中英对照 版本，有任何建议请联系yoyou2525@163.com。
我有一个使用angular 2的表单验证。[仅适用于Angular 2]如何使用以下方式启动验证部分？
app.component.html：
<form #registrationForm="ngForm" (ngSubmit)="submitform()">
<input type="text" class="form-control" name="name" formControlName="name" />
</form>
app.component.ts：
import { Component, Input, OnInit } from '@angular/core';
import { FormBuilder,FormGroup,Validators } from '@angular/forms';
export class AppComponent implements OnInit {
ngForm: FormGroup;
ngOnInit() {
this.ngForm = this._fb.group({
name: ['Select', Validators.required]
});
}
submitform() {
this.formSubmitted = true;
if (!this.ngForm.valid) {
alert("Form Not valid");
} else {
alert("Valid");
}
}
}
上面的脚本不起作用..我在哪里弄错了？
您的模板有问题。 代替使用#registrationForm="ngForm"使用[formGroup]="ngForm"
您使用的是反应式表单方法，在这种情况下，要在模板上映射表单，在Component上映射表单，请在模板的form标记上使用[formGroup] 。
#registrationForm="ngForm"通常用于构建表单的模板驱动器策略中。 然后，在(submit)您还将表单传递给在这种情况下并不需要的方法。
另外，您应该使用(submit)而不是(ngSubmit)
尝试这个：
<form [formGroup]="ngForm" (submit)="submitform()">
<input type="text" class="form-control" name="name" formControlName="name" />
<button>Submit</button>
</form>
这是供您参考的示例StackBlitz 。
您要验证什么？ 只有一个输入字段，如果要验证，请尝试在输入字段上放置“ required”属性或条件以进行验证。 另外，如果您需要看一下简单的表单验证示例，请检查以下存储库： https : //github.com/alokstar/Angular4FormValidation
希望能帮助到你！
声明：本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.