Angular2 GA/Final Release中ControlGroup和Control的替代方案是什么?

the*_*man 4 angularjs angular2-forms angular

我在Angular2 RC1中开发了一个SPA,但是由于最终版本已经发布,我的组织决定将代码移植到Angular 2 GA.虽然我可以修复大部分破碎的东西,但我真的在与表格斗争.
在我之前的RC1代码中,我使用了ControlGroup和Control以及FormBuilder.我正在使用它们来做通常的形式的东西,如验证,添加和删除控件等.但现在显然它们已被删除,我不知道是什么取代了它们.
我尝试了API指南FormControl或FormGroup中的一些其他类,但两者都没有真正帮助.我想知道上面两个班级的替代品是什么.

编辑: FormControl和FormGroup消除了TypeScript文件中的错误,但是,在标记中,我收到inline template:0:0 caused by: No provider for FormBuilder!错误.

更新:我可以使用FormGroup,FormControl和FormBuilder.通过将ReactiveFormsModule添加到app.module.ts文件来解决上述错误.但是,我得到一个错误inline template:30:61 caused by: this.form._updateTreeValidity is not a function.
模板中的特定行是
<form #userForm="ngForm" (ngSubmit)="submitUser()" [formGroup]="userForm" novalidate autocomplete="off">

有任何想法吗?

P. *_*ney 5

已更新至当前的Angular(v4.0.1)

FormGroup或者FormBuilder可以代替使用.FormBuilder简直就是一种简单的方法FormGroup.因此建议用于较大/复杂的表格.

您在上面显示的代码的问题是您声明FormGroup和ngModel- #userForm="ngForm",这对我的理解不能一起使用 - 不管怎样都不容易 ......我也犯了这个错误.

private myForm: FormGroup;

constructor(){
    this.myForm = new FormGroup({
        name: new FormGroup({
            first: new FormControl('Nancy', Validators.required),
            last: new FormControl('Drew')
        }),
        email: new FormControl('')
    });
}

//The same thing using 'FormBuilder': (Note this would not change the template)
constructor(@Inject(FormBuilder) fb: FormBuilder) {
    this.myForm = fb.group({
        name: fb.group({
            first: ['Nancy', Validators.required],
            last: 'Drew',
        }),
        email: '',
    });
}
Run Code Online (Sandbox Code Playgroud)

你的模板是这样的:

<form [formGroup]="myForm" novalidate autocomplete="off">
    <div formGroupName="name" novalidate autocomplete="off">
        <input type="text" formControlName="first"/>
        <input type="text" formControlName="last"/>
        <span [hidden]="myForm.controls['name'].valid">Error</span>
    </div>
    <input type="text" formControlName="email"/>
</form>
Run Code Online (Sandbox Code Playgroud)

这种方法的替代方法是使用Angular的模板驱动表单,这是您将使用的方法[(ngModel)]="someInput"