单击角度5中的按钮时如何添加字段答案

【问题标题】：How to add fields when click on button in angular5单击角度5中的按钮时如何添加字段
【发布时间】：2019-01-18 12:30:12
【问题描述】：

当我单击下面链接中的“添加更多字段”按钮时，这些字段仅添加一次。当我再次单击时，这些字段被隐藏了。

我需要附加字段。我的意思是当我点击按钮的次数时，我需要显示字段

https://stackblitz.com/edit/angular-mz6aig?file=src%2Fapp%2Fapp.component.html

【问题讨论】：

你的问题不清楚
示例按照您完成的代码工作
您需要一个计数器，当您单击按钮时该计数器会增加，然后循环创建与计数器一样多的输入字段。

标签： angular

【解决方案1】：

需要使用ngfor根据点击次数来迭代item列表，

您需要使用数组将ng模型值从html传递到组件。

检查此工作代码它可能需要根据您的要求进行一些更改

https://stackblitz.com/edit/angular-jzyfpk

【讨论】：

是的，它正在工作，但添加新标题按钮也在重复多次。按钮标签在 html 中有两次。当我删除一个按钮标签时，什么都不会显示。我试过这个。 stackblitz.com/edit/…

【解决方案2】：

您的代码没有添加字段，而是在您第一次单击时将变量tmpo 从undefined 更改为1，第二次从1 更改为2。

您的第一个 *ngIf 检查值是否不是 1，并且 undefined 与此条件匹配。然后你将它设置为 1，所以它不再匹配，你去阻止 #temp 再次显示按钮，这一次要求 tmpo 不是 2，值 1 匹配。接下来单击您将 tmpo 设置为 2，因此第一个 *ngIf 再次匹配 (tmpo (value:2) != 1)。

总而言之，您只需在这些块之间切换。要添加块，您需要绑定一些数组模型。

【讨论】：