Angular2 *ngFor把数据显示在多个input中出错解决方法

发布时间：2020-12-17 10:39:04 所属栏目：安全来源：网络整理

导读：点击添加按钮会自动添加一个空的input组 html js = '' '' (! .options.properties = deleteProperty(index) { /spanspan style="color: #0000ff"gt;this/span.options.properties.splice(index,1span style="color: #000000"gt;);}/span/pre 出现的问题是，

点击添加按钮会自动添加一个空的input组

html

='''' (!.options.properties =

deleteProperty(index) {
    </span><span style="color: #0000ff"&gt;this</span>.options.properties.splice(index,1<span style="color: #000000"&gt;);
}</span></pre>

出现的问题是，当我在第一行input中分别添加上数据xxx，ddd后，再次点击添加按钮，此时页面刷新，添加一个空的input行，此时有两行，而第一行input中填好的值却不见了，查看元素它的model属性明明又是绑定了刚输入的值的，页面上怎么没有显示呢？

通过查阅资料了解到在ng2表单中使用ngModel需要注意,必须带有name属性或者使用 [ngModelOptions]=”{standalone: true}”，二选其一，再看我的html代码中我把显示name的input的name属性设置为一个定值，这样再经过*ngFor后，显示不同name值的input的name属性都是一样的，是不是这个原因导致的呢，于是就试着把每个input的name属性设为不一样的值：

[value]="property.name" [(ngModel)]="property.name"> [(ngModel)]="property.value" > >

问题解决了。。。。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!