单击angular5中的按钮时如何添加字段

Question

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

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

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

Answer 1

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

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

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

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

Answer 2

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

您的第一个* ngIf检查值是否不是1，并且undefined与此条件匹配。然后将其设置为1，使其不再匹配，然后转到块#temp，再次显示该按钮，这次要求tmpo不为2，该值等于1。下一步，将tmpo设置为2，因此第一个* ngIf再次匹配（tmpo（value：2）！= 1）。

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