我的前端有两个空文本框,一个是键,另一个是值,一个是add按钮,一个submit button.User可以单击add按钮,再添加两个文本框,每个文本框分别代表键和值。
用户可以在文本框中添加任何文本作为键,任何文本作为值。提交按钮是提交最后的表格。我希望在angularJS中获取这些数据,并通过post请求将这些数据进一步传递给java。
具体来说,java中的Map在转换为Json时如下所示。
{"A":"something","B":"something","C":"something","D":"value"}
但是我无法使用angularJS从前端动态地创建这样的结构。
发布于 2016-04-25 04:36:27
因为您需要映射键和值,所以我不推荐数组。我想这就是你需要的:
$scope.map={};
// Add header data
$scope.addToMap=function()
{
$scope.map[$scope.key]=$scope.value;
$scope.key=""; //clear the textbox
$scope.value=""; //clear the textbox
};
单击按钮时执行addToMap()
。您还可以使用不可编辑文本框的ng-repeat
,并在map
上运行ng-repeat
。
发布于 2016-04-25 04:40:24
尝试下面的代码来创建动态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>
发布于 2016-04-25 04:39:12
试试这里是工作的小提琴
<div ng-controller="MyCtrl">
<div ng-repeat="item in items">
<input type="text" ng-model="item">
</div>
<button ng-click="addItem()">Add</button>
</div>
控制器
var myApp = angular.module('myApp',[]);
myApp.controller('MyCtrl',function($scope){
$scope.items=['item1','item2','item3','item4','item5'];
$scope.addItem = function(){
$scope.items.push('');
}
})
https://stackoverflow.com/questions/36840404
复制