【发布时间】：2015-05-05 07:38:39
【问题描述】：
我将解释我需要什么。我有一个 JSON，我在其中执行一些操作，包括动态创建一些输入。例子在这里：
实际上，当我创建一个输入时（只需点击列表中的一个项目，例如“asd1”），它会用新值填充一个新的 JSON。我需要的是将相同的项目分组到一个唯一的数组中。所以，这是它现在创建的 JSON：
{
"objects":[
{
"name":"firstObj",
"attributes":[
{
"attrname":"asd1",
"attrValue":"aaaDDD",
"attrType":"text",
"clicks":1
},
{
"attrname":"asd1",
"attrValue":"qwe",
"attrType":"text",
"clicks":2
}
]
}
]
}
应该是这样的：
{
"objects":[
{
"name":"firstObj",
"attributes":[
{
"attrname":"asd1",
"attrValue":[
"aaaDDD",
"qwe"
],
"attrType":"text",
"clicks":2
}
]
}
]
}
我已将attrValue 分组到一个数组中，因为我从“asd1”attrname 创建了两次相同的输入。我怎么能做到？顺便说一下，这里有一些代码：
Javascript：
var myApp = angular.module('myApp',[]);
myApp.controller("mycontroller", ["$scope", "$http",
function($scope, $http){
$scope.getItems = {
"data": [
{
"label": "first",
"objects": [
{
"name": "firstObj",
"attributes": [
{
"attrname": "asd1",
"attrValue": "",
"attrType":"text"
},
{
"attrname": "asd2",
"attrValue": "",
"attrType":"text"
}
]
}
],
"key": "bolla"
},
{
"label": "second",
"objects": [
{
"name": "secondObj",
"attributes": [
{
"attrname": "asd",
"attrValue": "",
"attrType":"text"
},
{
"attrname": "asd3",
"attrValue": "",
"attrType":"text"
}
]
}
],
"key": "2"
}
]
};
$scope.filterSelected = $scope.getItems.data[0].objects;
$scope.myNewArray = {
objects: [
]
}
$scope.createjson = function(attribute, items) {
var obj = {};
obj.name = angular.copy(attribute);
obj.attributes = [];
obj.attributes.push(angular.copy(items));
return obj;
}
$scope.checkIfAttributeExists = function(attribute) {
for(var i=0; i<$scope.myNewArray.objects.length; i++) {
if($scope.myNewArray.objects[i]["name"] == attribute) {
return i;
}
}
return -1;
}
$scope.pushItems = function pushItems(attribute, items) {
if (items.clicks) {
items.clicks++
} else {
items.clicks = 1
}
var index = $scope.checkIfAttributeExists(attribute);
if(index == -1) {
var obj = $scope.createjson(attribute, items);
$scope.myNewArray.objects.push(angular.copy(obj));
}
else {
$scope.myNewArray.objects[index].attributes.push(angular.copy(items));
}
//console.log($scope.myNewArray);
}
// remove function
$scope.removeItem=function(attribute){
attribute.clicks--;
var idx = $scope.myNewArray.objects.indexOf(attribute);
$scope.myNewArray.objects.splice(idx, 1);
}
$scope.showNewJson = function() {
return $scope.myNewArray;
}
}]);
HTML：
<div ng-app='myApp' ng-controller='mycontroller'>
<div data-ng-repeat="item in myNewArray.objects track by $index">
<div data-ng-repeat="attr in item.attributes track by $index">
<div ng-if="attr.attrType == 'text'" >
<input id="form-f{{$index}}" type="text" placeholder="{{attr.attrname}}" data-ng-model="attr.attrValue"/> <button ng-click="removeItem(attr)">Remove</button>
</div>
</div>
</div>
<div data-ng-repeat="object in getItems.data">
<div data-ng-repeat="att in object.objects">
<ul ng-repeat="data in att.attributes">
<li>
<a ng-click="pushItems(att.name, data)">{{data.attrname}}</a>
<span>({{data.clicks}})</span>
</li>
</ul>
</div>
</div>
<p>{{showNewJson()}}</p>
</div>
PS：我使用 Angularjs
【问题讨论】：
-
如果你想改变
$scope.myNewArray你也需要改变标记 -
或者您只想创建具有新结构的新数组？
-
sidenote：我想，你的 remove 按钮工作错误
-
@Grundy 检查我在任务中创建的两个 JSON。第一个，你看到现在是什么。第二个是应该是什么。如果我在“asd1”上单击 3 次，它会创建 3 个输入，对吗？当我在这 3 个输入中添加一些值时，我需要创建一个类似于第二个的结构。所以 attrValue 将被分组到一个数组中，并插入值。
-
@Grundy 是的，删除不起作用:(
标签： javascript arrays json angularjs