【问题标题】:Nested JSON, remove object based on a condition in Jquery using angularjs嵌套JSON,使用angularjs根据Jquery中的条件删除对象
【发布时间】:2016-08-24 15:23:08
【问题描述】:

我在这个变量 $scope.bbTreeData 中有一个 JSON 对象。我正在尝试删除标志为假的对象。我能够遍历嵌套的 JSON 对象,但我不确定如何删除该对象?有什么建议吗?

[{
  "market": "Atl",
  "subItem": [{
    "comment_id": "1",
    "user_id": "32509",
    "flag": true
  }, {
    "comment_id": "2",
    "user_id": "32510",
    "flag": false

  }]
}, {
  "market": "Chicago",
  "subItem": [{
    "comment_id": "3",
    "user_id": "32501",
    "flag": true
  }, {
    "comment_id": "4",
    "user_id": "32502",
    "flag": false

  }]
}]

$scope.bbTreeInactiveData = angular.copy($scope.bbTreeData);
angular.forEach($scope.bbTreeInactiveData, function(item) {
  angular.forEach(item.subItem, function(record, index) {
    if (record.flag == false) {
      console.log(item.subItem, index);
      /* code to remove the object*/
    }
  });
});

【问题讨论】:

  • 使用 Array.filter 代替 Array.forEach。或者,使用 Array.splice 手动将记录拼接出数组

标签: javascript jquery angularjs json


【解决方案1】:

你可以使用_underscorejs的_without()函数

见documentation

没有
_.without(array, 值)

返回删除所有值实例的数组副本。

_.without([1, 2, 1, 0, 3, 1, 4], 0, 1);
=> [2, 3, 4]

输入

[
    {
        "market": "Atl",
        "subItem": [
            {
                "comment_id": "1",
                "user_id": "32509",
                "flag": true
            },
            {
                "comment_id": "2",
                "user_id": "32510",
                "flag": false
            }
        ]
    },
    {
        "market": "Chicago",
        "subItem": [
            {
                "comment_id": "3",
                "user_id": "32501",
                "flag": true
            },
            {
                "comment_id": "4",
                "user_id": "32502",
                "flag": false
            }
        ]
    }
]

输出

[
    {
        "market": "Atl",
        "subItem": [
            {
                "comment_id": "1",
                "user_id": "32509",
                "flag": true
            }
        ]
    },
    {
        "market": "Chicago",
        "subItem": [
            {
                "comment_id": "3",
                "user_id": "32501",
                "flag": true
            }
        ]
    }
]

代码片段

var json = JSON.parse('[{"market":"Atl","subItem":[{"comment_id":"1","user_id":"32509","flag":true},{"comment_id":"2","user_id":"32510","flag":false}]},{"market":"Chicago","subItem":[{"comment_id":"3","user_id":"32501","flag":true},{"comment_id":"4","user_id":"32502","flag":false}]}]');

for(var i=0; i<json.length; i++) {
    json[i].subItem = _.without(json[i].subItem, _.findWhere(json[i].subItem, {flag: false}));
};

console.log(JSON.stringify(json, 0, 8));
&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"&gt;&lt;/script&gt;

【讨论】:

  • var json = JSON.parse('[{"market":"Atl","subItem":[{"comment_id":"1","user_id":"32509","flag ":false},{"comment_id":"2","user_id":"32510","flag":false}]},{"market":"Chicago","subItem":[{"comment_id": "3","user_id":"32501","flag":true},{"comment_id":"4","user_id":"32502","flag":false}]}]');跨度>
  • 如果我更改 JSON,我不会得到想要的结果。我将所有子项、标志更改为 false
  • @user1005310 这一行只是为了包含测试数据。您可以省略此行并继续使用您的对象
  • @user1005310 只需使用 3 行 for 循环并将 json 替换为您的对象。不要忘记在&lt;head&gt; 标签中包含underscore-min.js。
【解决方案2】:

试试这个:

$scope.bbTreeInactiveData = angular.copy($scope.bbTreeData);

var results = $scope.bbTreeInactiveData.map(function(row) {
  return row.subItem.filter(function(cell) {
    return cell.flag == true
  });
});

使用map() 和filter() 函数。

【讨论】:

  • 如果您需要原始数据进行进一步处理,制作副本是安全的。
【解决方案3】:

您可以在纯 JavaScript 中使用 delete 关键字:

delete item.subItem[index]

我相信已经有答案了:How do I remove a property from a JavaScript object?

如果你想删除根,在你的第一个forEach添加一个索引参数,然后用数组拼接函数删除根:

$scope.bbTreeInactiveData.splice(indexRoot,1);

【讨论】:

  • 这会删除子项,但对于删除所有子项的情况,根元素仍然存在。如何删除根级别元素?例如删除所有子项标志设置为 false 的市场 Atl
  • 同样简单:delete item[indexRoot]。您需要为您的第一个 forEach 添加索引。你也想给它起不同的名字
  • 实际上,由于根元素是一个数组,我的第二个答案会为每个已删除元素为您提供undefined 的数组,而不是您要查找的内容
猜你喜欢
  • 1970-01-01
  • 2014-01-09
  • 1970-01-01
  • 1970-01-01
  • 2019-08-18
  • 2020-03-30
  • 2021-07-15
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多