typescript Angular 2 表单“找不到控件”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/38594344/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular 2 Form "Cannot Find Control"
提问by Marcus Scaffidi
I am trying to use Angular 2 Forms for validation, but when I try to add more than one control. It seems like it just gets ignored. I have followed many different guides to see how everyone else does it, but none of those ways seem to work.
我正在尝试使用 Angular 2 Forms 进行验证，但是当我尝试添加多个控件时。似乎只是被忽略了。我遵循了许多不同的指南，看看其他人是如何做到的，但这些方法似乎都不起作用。
What I have been doing is this in my template:
我一直在做的是在我的模板中：
<form [formGroup]="form" novalidate (ngSubmit)="save(form.valid)">
<div class="row" id="message-wrapper">
<label>Message</label>
<small [hidden]="form.controls.message.valid || (form.controls.message.pristine && !submitted)">
Message is required (minimum 10 characters).
</small>
<textarea
class="textarea-scaled"
type="text"
[(ngModel)]="campaign.message"
formControlName="message"
placeholder="This will be sent out by supporters with a URL back to this campaign">
</textarea>
</div>
<div class="row" id="promo-wrapper">
<label>Promotion: </label>
<small [hidden]="form.controls.promotion.valid ||(form.controls.promotion.pristine && !submitted)">
Promotion is required and should be between 10 and 100 characters
</small>
<textarea
class="textarea-scaled"
type="text"
[(ngModel)]="campaign.promotion"
formControlName="promotion"
placeholder="What would you like to be sent out in promotional messages?">
</textarea>
</div>
</form>
Then in my component I do this:
然后在我的组件中我这样做：
form: FormGroup;
constructor(private builder: FormBuilder,
private _dataservice: DataService) {
this.form = builder.group({
"message": ['', [Validators.required, Validators.minLength(10)]],
"promotion": ['', [Validators.required, Validators.minLength(10)]]
});
}
But I keep getting a "Cannot find control 'promotion'" console error...
但我不断收到“无法找到控制'升级'”控制台错误...
Any help will be appreciated!
任何帮助将不胜感激！
回答by JenonD
This may not be the answer to the original question, but this may be useful if you jumped here from google.
这可能不是原始问题的答案，但如果您从 google 跳到这里，这可能会很有用。
You need to check these things.
你需要检查这些东西。
You must have a "
name" attribute for all the controls which has[ngModel]If you exclude some fields from validation, then add
[ngModelOptions]="{standalone: true}"(remember the first rule, still you need a "name")Make sure you have
formControlNameattribute for the controls that you are going to validate. (remember the first rule)
你必须有一个“
name对所有具有控制”属性[ngModel]如果您从验证中排除某些字段，则添加
[ngModelOptions]="{standalone: true}"（记住第一条规则，您仍然需要一个“名称”）确保您拥有
formControlName要验证的控件的属性。（记住第一条规则）
回答by Aravind
I tried to create new FormGroup in my component. I've imported ReactiveFormsModule from angular/forms and added to app.module.ts imports.
我试图在我的组件中创建新的 FormGroup。我已经从 angular/forms 导入了 ReactiveFormsModule 并添加到 app.module.ts 导入中。
but I was getting Cannot find name 'FormGroup'and Cannot find name 'FormControl'errors
但我遇到了无法找到名称“FormGroup”和无法找到名称“FormControl”的错误
Here is my component
这是我的组件
export class SignupFormComponent {
form1 = new FormGroup({
username: new FormControl(),
password: new FormControl()
});
}
Adding the below import statement in component resolved my issue.
在组件中添加以下导入语句解决了我的问题。
import { FormGroup, FormControl } from '@angular/forms';
Not the answer to your question but Posting as this might help someone who faces same error.
不是您问题的答案，而是发布，因为这可能会帮助面临同样错误的人。
