从JSON删除项目再次单击结束 [英] remove item from json click over again
问题描述
我问过一些时间前如何从JSON更正是这里的项目：<一href=\"http://stackoverflow.com/questions/30367472/angular-remove-item-from-json/30367765?noredirect=1#comment48826327_30367765\">Angular从JSON
删除项目和它的工作以及..现在我已经得到了同样的问题，但code是一个有点不同。总之，我有一个列表。当我点击了一个项目它增加了其属性的JSON。我想，如果我在这个项目再次单击它JSON删除其属性。所以，我点击项目1，并增加了，再次单击项目1及排除。
这是我试过
myApp.controller（myController的，[$范围，$ HTTP
功能（$范围，$ HTTP）{
$ scope.getItems = {
数据：
{
标签：第一次，
物：
{
名：firstObj
属性：
{
attrname：项目1，
attrValue：，
attrType：文本
}，
{
attrname：项目2，
attrValue：，
attrType：文本
}
]
}
]
钥匙：波拉
}
]};
$ scope.filterSelected = $ scope.getItems.data [0] .objects; $ scope.myNewArray = {
对象： ]
} $ scope.createjson =功能（属性，物品）{
变种物镜= {};
obj.name =属性;
obj.attributes = [];
obj.attributes.push（项目）;
返回OBJ;
} $ scope.checkIfAttributeExists =功能（属性）{
对于（VAR I = 0; I＆LT; $ scope.myNewArray.objects.length;我++）{
如果（$ scope.myNewArray.objects [I] [名称] ==属性）{
返回我;
}
}
返回-1;
} $ scope.pushItems =功能pushItems（属性，物品）{
VAR指数= $ scope.checkIfAttributeExists（属性）;
如果（指数== -1）{
VAR OBJ = $ scope.createjson（属性，项目）;
$ scope.myNewArray.objects.push（OBJ）;
}否则如果（指数！== -1）{ $ scope.myNewArray.objects.splice（指数，1）; }其他{
$ scope.myNewArray.objects [指数] .attributes.push（项目）;
}
} $ scope.showNewJson =功能（）{
返回$ scope.myNewArray;
}
}]）;
看来，这个问题是在索引中。在这里，我创建了一个的jsfiddle：
更新链接：
https://jsfiddle.net/vuqcopm7/53/
其实这是code做什么：
<$p$p><$c$c>{\"objects\":[{\"name\":\"firstObj\",\"attributes\":[{\"attrname\":\"Item1\",\"attrValue\":\"\",\"attrType\":\"text\"}]},{\"name\":\"firstObj\",\"attributes\":[{\"attrname\":\"Item1\",\"attrValue\":\"\",\"attrType\":\"text\"}]},{\"name\":\"firstObj\",\"attributes\":[{\"attrname\":\"Item2\",\"attrValue\":\"\",\"attrType\":\"text\"}]}]}正如你可以看到有两次属性项目1，因为我在两次点击。但是，如果我点击两次项目1到消失！所以，正确的JSON将是：
<$p$p><$c$c>{\"objects\":[{\"name\":\"firstObj\",\"attributes\":[{\"attrname\":\"Item2\",\"attrValue\":\"\",\"attrType\":\"text\"}]}]}您可以大大简化您的code如下：
HTML
＆LT; UL NG重复=，在att.attributes项目＆GT;
＆LT;立GT;
＆LT;一个NG点击=pushItems（项目）＆GT; {{item.attrname}}＆LT; / A＆GT;
＆LT; /李＆GT;
＆LT; / UL＆GT;
JS
$ scope.pushItems =功能pushItems（项目）{//注单只现在的说法
//指数整个项目对象
VAR的ItemIndex = $ scope.myNewArray.objects.indexOf（项目）;
如果（==的ItemIndex -1）{
//如果索引不存在...添加到阵列
$ scope.myNewArray.objects.push（项目）;
}其他{
//否则从数组中删除
$ scope.myNewArray.objects.splice（的ItemIndex，1）;
}
}
通过与对象本身的工作，你不需要看对象的属性做你检查，看是否存在与否，检查实际对象的索引，而不是
<大骨节病> 演示
I've asked some times ago how to remove an item from json more exactly here: Angular remove item from json
and it worked well.. now i've got the same problem but the code is a little bit different. In summary, i have a list. When i click over an item it adds its attributes in a json. I would that if i click again in this item it removes its attributes from json. So, i click Item1 and adds, click again Item1 and removes.
This is what i tried
myApp.controller("mycontroller", ["$scope", "$http",
function($scope, $http){
$scope.getItems = {
"data": [
{
"label": "first",
"objects": [
{
"name": "firstObj",
"attributes": [
{
"attrname": "Item1",
"attrValue": "",
"attrType":"text"
},
{
"attrname": "Item2",
"attrValue": "",
"attrType":"text"
}
]
}
],
"key": "bolla"
}
]
};
$scope.filterSelected = $scope.getItems.data[0].objects;
$scope.myNewArray = {
objects: [
]
}
$scope.createjson = function(attribute, items) {
var obj = {};
obj.name = attribute;
obj.attributes = [];
obj.attributes.push(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) {
var index = $scope.checkIfAttributeExists(attribute);
if(index == -1) {
var obj = $scope.createjson(attribute, items);
$scope.myNewArray.objects.push(obj);
} else if(index !== -1) {
$scope.myNewArray.objects.splice(index, 1);
}else {
$scope.myNewArray.objects[index].attributes.push(items);
}
}
$scope.showNewJson = function() {
return $scope.myNewArray;
}
}]);
Seems that the problem is in the index. Here i created a jsFiddle:
Update link: https://jsfiddle.net/vuqcopm7/53/
Actually this is what the code do:
{"objects":[{"name":"firstObj","attributes":[{"attrname":"Item1","attrValue":"","attrType":"text"}]},{"name":"firstObj","attributes":[{"attrname":"Item1","attrValue":"","attrType":"text"}]},{"name":"firstObj","attributes":[{"attrname":"Item2","attrValue":"","attrType":"text"}]}]}
As you can see there are two times the attribute "Item1" because i clicked twice over it. But if i click twice the Item1 get to disappear! So the correct json will be:
{"objects":[{"name":"firstObj","attributes":[{"attrname":"Item2","attrValue":"","attrType":"text"}]}]}
You can greatly simplify your code as follows:
HTML
<ul ng-repeat="item in att.attributes">
<li>
<a ng-click="pushItems(item)">{{item.attrname}}</a>
</li>
</ul>
JS
$scope.pushItems = function pushItems(item) { // note only single argument now
// index the whole item object
var itemIndex = $scope.myNewArray.objects.indexOf(item);
if (itemIndex == -1) {
// if index doesn't exist ...add to array
$scope.myNewArray.objects.push(item);
} else {
// otherwise remove from array
$scope.myNewArray.objects.splice(itemIndex, 1);
}
}
by working with the object itself you don't need to look at properties of the object to do your check to see if it exists or not, check the index of the actual object instead
这篇关于从JSON删除项目再次单击结束的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
