java 使用angularjs动态创建键值对并将其传递给java Map
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/36840404/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Creating key,value pair dynamically with angularjs and passing the same to java Map
提问by Amit
I have two empty text boxes in front end one for key and another for value one add button and a submit button.User can click on the add button to add one more pair of two text boxes each representing key and value respectively.
我在前端有两个空文本框，一个用于键，另一个用于值，一个添加按钮和一个提交按钮。用户可以单击添加按钮添加另外一对两个文本框，每个文本框分别代表键和值。
User is free to add any text as key and any text as value in the text boxes. The submit button is to submit the final form. I want to get these data in angularJS and further pass this to java Map through a post request.
用户可以在文本框中自由添加任何文本作为键和任何文本作为值。提交按钮是提交最终的表单。我想在 angularJS 中获取这些数据，并通过 post 请求进一步将其传递给 java Map。
To be specific a Map in java looks like this when converted to Json.
具体来说，当转换为 Json 时，java 中的 Map 看起来像这样。
{"A":"something","B":"something","C":"something","D":"value"}
But I am not able to create such structure dynamically from front end using angularJS.
但是我无法使用 angularJS 从前端动态创建这样的结构。
回答by Dushyant Bangal
As you need to map the key and value, I wont recommend array. I think this is what you need:
由于您需要映射键和值，我不会推荐数组。我认为这就是你需要的：
$scope.map={};
// Add header data
$scope.addToMap=function()
{
$scope.map[$scope.key]=$scope.value;
$scope.key=""; //clear the textbox
$scope.value=""; //clear the textbox
};
execute addToMap()when your button is clicked. You can also have an ng-repeatwith non-editable text boxes, and run the ng-repeaton map
addToMap()单击按钮时执行。您也可以有一个ng-repeat非可编辑的文本框，并运行ng-repeat上map
回答by Sachin K
Try following code to create dynamic JSON object.
尝试使用以下代码创建动态 JSON 对象。
var myApp = angular.module('myApp',[]);
myApp.controller('MyCtrl', ['$scope', function MyCtrl($scope) {
$scope.jsonObject = {};
$scope.add = function(){
$scope.jsonObject[$scope.key] = $scope.value;
};
$scope.submitForm = function(){
console.log($scope.jsonObject);
}
}]);<div ng-controller="MyCtrl">
<form>
Key: <input ng-model="key">
Value: <input ng-model="value">
<button ng-click="add()">ADD</button>
<button ng-click="submitForm()">submit form</button>
</form>
<span>{{jsonObject}}</span>
</div>回答by pgksunilkumar
Check this Plunker http://plnkr.co/edit/sgKYtxFGL1JyrVFMkQM4?p=info
检查这个Plunker http://plnkr.co/edit/sgKYtxFGL1JyrVFMkQM4?p=info
$scope.name = {"A":"something","B":"something","C":"something","D":"value"};
$scope.example = $scope.name["A"];
回答by Devidas Kadam
try this here is the working fiddle
试试这里是工作小提琴
<div ng-controller="MyCtrl">
<div ng-repeat="item in items">
<input type="text" ng-model="item">
</div>
<button ng-click="addItem()">Add</button>
</div>
Controller
控制器
var myApp = angular.module('myApp',[]);
myApp.controller('MyCtrl',function($scope){
$scope.items=['item1','item2','item3','item4','item5'];
$scope.addItem = function(){
$scope.items.push('');
}
})
