Angular 2 Typescript：TypeError：this.validator 不是函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/37564574/
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 Typescript: TypeError: this.validator is not a function
提问by Ruben
I'm building a form with ControlGroup and I'm loading a class object in it. However I'm running into the error mentioned in the title half of the time. Some forms do load and some don't.
我正在使用 ControlGroup 构建一个表单，并在其中加载一个类对象。但是，我有一半的时间遇到了标题中提到的错误。有些表格会加载，有些则不会。
I have a class file like so:
我有一个像这样的类文件：
export class User {
id: number;
email: string;
sign_in_count: number;
created_at: string;
first_name: string;
last_name: string;
birth_date: Date;
news_letter: boolean;
fb_id: string;
gender: boolean;
phone: string;
picture: any;
}
In my UserDetailComponent I load the class in the control like this:
在我的 UserDetailComponent 中，我将类加载到控件中，如下所示：
export class UserDetailComponent implements OnInit {
user: User;
userDetailForm: ControlGroup;
constructor(
private form: FormBuilder,
private _userService: UserService,
private _router: Router,
private params: RouteSegment
) { }
ngOnInit() {
this.user = this._userService.getUser();
if (this.user === undefined) {
this._userService.getSingleUser(this.params.getParam('id'))
.subscribe(data => (this.user = data, this.setForm()));
} else {
this.setForm();
}
}
setForm() {
this.userDetailForm = this.form.group(this.user);
}
}
On that last line I get the error of which the stacktrace is below:
在最后一行，我得到堆栈跟踪如下的错误：
browser_adapter.ts:78 TypeError: this.validator is not a function
at Control.AbstractControl._runValidator (model.ts:146)
at Control.AbstractControl.updateValueAndValidity (model.ts:128)
at new Control (model.ts:282)
at FormBuilder.control (form_builder.ts:32)
at FormBuilder._createControl (form_builder.ts:66)
at eval (form_builder.ts:50)
at Function.StringMapWrapper.forEach (collection.ts:132)
at FormBuilder._reduceControls (form_builder.ts:49)
at FormBuilder.group (form_builder.ts:19)
at UserDetailComponent.setForm (user-detail.component.ts:95)
回答by M K
I had this error when I was binding an array of values in form builder the wrong way.
当我以错误的方式在表单构建器中绑定一组值时，我遇到了这个错误。
What I did:
我做了什么：
fb.group({items: [1, 2, 3, 4]})
How it should be:
应该如何：
fb.group({items: [[1, 2, 3, 4]]})
You have to wrap everything into an array, otherwise angular thinks that [1, 2, 3, 4]is a form control definitionrather then a form control value.
您必须将所有内容都包装到一个数组中，否则 angular 会认为这[1, 2, 3, 4]是一个表单控件定义而不是表单控件值。
回答by Günter Z?chbauer
Create the form in the constructor. When Angular doesn't find the form on it's first attempt to resolve bindings then it doesn't work.
在构造函数中创建表单。当 Angular 在它第一次尝试解析绑定时找不到表单时，它就不起作用了。
this.userDetailFormjust needs to be initialized with an empty group or with a few static controls. Then when the data arrives from the server, update the group by adding/removing controls and updating values.
this.userDetailForm只需要使用一个空组或一些静态控件进行初始化。然后当数据从服务器到达时，通过添加/删除控件和更新值来更新组。
