什么是Angular 2 RC5编写基于模板的表单的方式？

Question

我必须说我对Web上有关RC5 Angular表单的不同教程感到困惑。官方文件也没有消除混淆。

丰富的指令（ngForm，ngModel，ngFormControl，ngControl，ngFormControlName，ngControlName，我错过了什么吗？）有些已被弃用，有些则不予批准。

另外，所有教程都是简单的路径 - 纯文本输入或选择控件。如果我需要单选按钮和复选框？

简而言之，我不知道如何在RC5中编写表格。

是否有某个例子，这是最新的并解释：

1. 使用4个基本控件 - 输入文本/收音机/复选框并选择？
2. 额外的好东西，比如脏/原始，验证？
3. 表单模型（FormBuilder，FormGroup，FormControl等等）

P.S。

我读到了什么？

• https://angular.io/docs/ts/latest/guide/forms.html
• https://scotch.io/tutorials/using-angular-2s-template-driven-forms
• https://scotch.io/tutorials/using-angular-2s-model-driven-forms-with-formgroup-and-formcontrol
• https://angular.io/docs/ts/latest/cookbook/dynamic-form.html
• http://blog.rangle.io/how-angular-2-form-models-work/
• http://blog.rangle.io/data-angular-2-forms/

我可能很蠢，但我仍然不知道在RC5中写表单的正确方法是什么。

Answer 1

我发现对于angular2形式非常困惑的是，有两种完全不同的构建它们的方式，这两种方式不能很好地混合。你有＆＃34;模板驱动＆＃34;，其中表格在html中尽可能地构建和处理，然后你有＆＃34;模型驱动＆＃34;表单在组件方面处理的地方。

我发现的不同类型的最佳描述是此视频，其中Kara Erickson对两者进行了演示。她在10-11分钟左右很好地解释了这些差异：

https://www.youtube.com/watch?v=E92KS_YCSf8

简而言之：

模板驱动表单

如果您想在模板html中进行所有表单处理（绑定，​​验证等），请使用以下指令：

• ngModel
• ngModelGroup
• ngForm

模型驱动形式（也称为反应形式）

如果您希望获得更好的控制，更好的可测试性，自定义验证器等，请使用以下控件在组件中手动生成表单：

• FormGroup
• FormControl
• FormArray
• 可选择使用FormBuilder来减少某些样板

然后使用以下指令将html form和input元素绑定到这些控件：

• formControlName
• formGroupName

编辑2016-09-02： 官方文档中现在有一本很好的食谱，很好地报道了模板/反应形式之间的差异： https://angular.io/docs/ts/latest/cookbook/form-validation.html

Answer 2

我喜欢FormBuilder，因为大部分代码都在ts而不是html中，所以有更好的编译时错误检查。 This page from the Angular2 documentation has a simple example。

PrimeNG有一些很棒的控件使用FormBuilder
另外，我有一些code here可能有助于说明有效/无效