混合反应形式和模板形式 [英] Mixing Reactive Form with Template Form
问题描述
我使用模板表单构建了一个包含大量输入的大表单.现在我需要动态添加一部分输入.由于使用 Reactive Form 动态添加输入似乎更容易，我想将输入的特定部分更改为 Reactive Form.
I have built a big form with lots of input using Template Form. Now I have got a requirement to add a part of input dynamically. Since adding inputs dynamically seems easier with Reactive Form, I would like to change that specific part of inputs to Reactive Form.
那么是否可以在同一个表单标签中混合反应表单和模板表单?
So is it possible to mix reactive forms and template forms in a same form tag?
推荐答案
你可以混合使用 反应式表单 和模板驱动的表单，但强烈不推荐使用.这是因为在响应式表单上使用 ngModel 违背了表单状态的不变性.
You can mix both reactive forms and template driven forms, but it is highly not recommended. This is because using ngModel on reactive forms goes against the idea of immutability of the form state.
响应式表单的原则遵循单向"数据绑定规则，您可以遵循一种不可变的方法来管理表单状态，从而在模板和组件逻辑之间有更大的关注点分离.您可以在第一段的链接上阅读更多关于反应式形式的优点.
The principles of reactive forms follows the 'one-way' data binding rule, whereby you follow an immutable method of managing the state of your forms, such that there is greater separation of concern between your template and component logic. You can read more about the advantages of reactive forms on the link at the first paragraph.
假设您要混合使用模板驱动的表单和反应式表单.运行ng serve时控制台会抛出以下错误:
Assuming you are going ahead with mixing template driven forms and reactive forms. The console will throw the following error when you run ng serve:
看起来您在与 formControlName 相同的表单字段上使用 ngModel.Angular v6 中不推荐使用 ngModel 输入属性和 ngModelChange 事件与响应式表单指令，并将在 Angular v7 中删除有关这方面的更多信息，请参阅我们的 API 文档:https://angular.io/api/forms/FormControlName#use-with-ngmodel
It looks like you're using ngModel on the same form field as formControlName. Support for using the ngModel input property and ngModelChange event with reactive form directives has been deprecated in Angular v6 and will be removed in Angular v7 For more information on this, see our API docs here: https://angular.io/api/forms/FormControlName#use-with-ngmodel
这篇关于混合反应形式和模板形式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
