[英]How to fetch data from Angular JS forms
I have created a plunker here: http://plnkr.co/qbWBFo that shows a form that I am auto filling based on some json (keys). 我在这里创建了一个plunker: http ://plnkr.co/qbWBFo,它显示了一个基于某些json(键)自动填充的表单。 When the user hits submit, I need to access all data that was filled in and create a json like shown below.
当用户点击提交时,我需要访问填写的所有数据并创建如下所示的json。 Obviously if the div named "myform.rows" had static fields I would be able to call $scope.myform.rows.
显然,如果名为“myform.rows”的div具有静态字段,我将能够调用$ scope.myform.rows。 and get all data.
并获取所有数据。 Any suggestions?
有什么建议么? Thank you
谢谢
UPDATE: The json that I want to get when a user hits submit after filling out all the form fields is something like this: 更新:填写完所有表单字段后用户点击提交时我想得到的json是这样的:
{
"Date Of Birth": {
"value": "19 May, 1990",
"tag": "a"
},
"Employer": {
"value": "Starbucks",
"tag": "b"
},
"First Name": {
"value": "Jane",
"tag": "a"
},
"Last Name":{
"value": "Doe",
"tag": "c"
},
"Middle Name": {
"value": "K.",
"tag": "c"
},
"Place Of Birth": {
"value": "Houston, Texas",
"tag": "d"
}
}
Use ng-model
on your form controls. 在表单控件上使用
ng-model
。 This will automatically bind to same variable in your scope. 这将自动绑定到范围中的同一变量。
Say you start an object in scope: $scope.myFormData={}
; 假设你在范围内开始一个对象:
$scope.myFormData={}
;
Then add to inputs ng-model
; 然后添加到输入
ng-model
;
<input ng-model="myFormData.name"/>
<input ng-model="myFormData.phone"/>
As user types the myFormData
object will be automatically updated with whatever ng-model
's that match that object 作为用户类型,
myFormData
对象将使用与该对象匹配的任何ng-model
自动更新
Then within submit method, you send that object to server. 然后在submit方法中,将该对象发送到服务器。
Following should work for you: 以下应该适合你:
<input type="text" ng-model="formData[k]"/>
Where k
is the key/property of the JSON. <input type="text" ng-model="formData[k]"/>
其中k
是JSON的键/属性。
I have created Plunkr here: http://plnkr.co/edit/hyBFpRr3OOtanuYsGibs 我在这里创建了Plunkr: http ://plnkr.co/edit/hyBFpRr3OOtanuYsGibs
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.