Angular2表单输入-无法填写文本

我创建了一个根据当前页面生成表单的组件：

提交
值：{form.Value | json}

验证状态：{form.status}

提交
值：{form.Value | json}

验证状态：{form.status}

采用本试验方法：

checkCurrentDetails（）{
if（this.currentDetails['site']=='Dimension Attributes'）{
this.form=this.fb.group({
姓名：this.fb.group({
第一个：['Nancy'，Validators.minLength（2）]，
最后一句：“Drew”，
}),
电子邮件：“”，
});
返回此.currentDetails['site']；
}
if（this.currentDetails['site']=='Dimension'）{
this.form=this.fb.group({
姓名：this.fb.group({
第一个：['Nanci'，Validators.minLength（2）]，
最后一句：“Drew”，
}),
电子邮件：“”，
});
返回此.currentDetails['site']；
}
}

它很好地根据站点生成表单，并且正在生成此表单：

在文本框中，您可以看到预定义的测试内容。例如，第一个文本框：“Nanci”等。 但现在来谈谈我的问题。我无法在这些文本框中键入、更改或插入文本。好像有什么东西挡住了它

所以我尝试了另一种方法来测试它是否与表单有关。我创建了一个文本框

<input type='text'> 

在表单之外，它工作得很好。我可以在此框中输入文本，但不能在表单中的文本框中输入文本，我不知道为什么？

问题在于

在文本框中键入时，将运行ChangeDetection并重新评估模板。因此，每次在文本框中键入时，都会调用

checkCurrentDetails（）

函数，并重新创建/呈现表单！因此，您一次又一次地看到表单的初始状态，并感觉输入被阻止了

只需将其更改为

而且它很有效

以下是工作样本的Plunker链接：

---

您能否详细说明“无法输入或更改这些表格的文本”？您不能在浏览器中的控件中键入内容吗？您对

valueChanges

的订阅是否未被触发？您的意思是您可以在文本框中输入，还是在表单对象中看不到输入的数据？我无法在文本框中键入文本。似乎有什么东西阻止了表单的输入。顺便说一句，我可以在一个未连接到表单的文本框中键入文本。请给出答案。谢谢您的快速回复。我换了主贴。您好，先生，谢谢您的回复。这是可行的，但不是问题的解决方案。我想解释一下。这是一个详细信息窗格，因此我想根据网站标题呈现一个表单，网站标题由以下内容更改：constructor（_globalService:globalService，private fb:FormBuilder）{This.currentDetails=_globalService.currentTitle；This.subscription=_globalService.nameChange.subscribe（（值）=>{this.currentDetails=JSON.parse（value）；}）；例如：我们有site1、site2、site3。主组件中有一个detailspan.component。一个全局服务正在更改站点的标题。我想根据站点标题更改详细信息窗格中的表单。如果是site1，则表单呈现为3个字段。如果是site2，则假设我需要10个字段等。在这种情况下，您有执行用于在组件代码中确定表单类型的逻辑。您可以将其放入单个变量中。并将该

变量
与
*ngIf
或
*ngSwitch
一起使用，以呈现适当的表单。如果您在
*ngIf
中调用函数本身，则每次出现更改时，Angular2的更改检测都将执行它当前表单中的更改。希望您现在理解。订阅全局服务，每当收到订阅值的更改时，执行逻辑以查找要显示的表单并将其保存在变量中。在HTML模板上，将该值与
*ngIf*
一起使用以显示相应的表单。