ng-model不会更新更改后的表单内容 [英] ng-model won't update the changed form content
本文介绍了ng-model不会更新更改后的表单内容的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个带有删除条目按钮和添加条目按钮的表格.我想将更新的表单字段数据输出到formData={}
,以便提交的数据是最新的.但是,当删除字段集时,formData={}
不会使用最新的数据输入信息进行更新,并且旧的表单数据仍然存在于formData={}
中. 这是我的代码的链接
I have a form which has a delete entry button and an add entry button. I want to output the updated form field data to formData={}
, so that the submitted data will be up-to-date. However, when a fieldset is deleted, formData={}
is not updated with the newest data entry information and the old form data still exist in formData={}
. Here's the link for my code
推荐答案
尝试这样.
var app = angular.module("app",[]);
app.controller("MyCtrl" , function(){
var formCtrl = this;
formCtrl.forms ={
formData:[{ name:""}]
};
formCtrl.addFields = function(){
var name = {name:""};
formCtrl.forms.formData.splice(formCtrl.forms.formData.length,0,name);
};
formCtrl.rmFields = function(form){
var index = formCtrl.forms.formData.indexOf(form);
formCtrl.forms.formData.splice(index,1);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="MyCtrl as formCtrl">
<table>
<tr ng-repeat="form in formCtrl.forms.formData">
<td> <input type="text" ng-model="form.name"></td>
<td> <input type="button" ng-click="formCtrl.addFields()" value="Add" ng-show="$last"></td>
<td> <input type="button" ng-click="formCtrl.rmFields(form)" value="Delete" ng-show="$index != 0"></td>
</tr>
</table>
<span> <pre>{{formCtrl.forms | json }}</pre></span>
</div>
这篇关于ng-model不会更新更改后的表单内容的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文