如何在不迭代数组的情况下从 $scope 中删除对象？答案

【问题标题】：How to remove object from $scope without iterating array?如何在不迭代数组的情况下从 $scope 中删除对象？
【发布时间】：2015-09-09 14:35:26
【问题描述】：

所以，我有 jsfiddle here。

我们可以添加新节点并删除父节点中的所有子节点。但是如何在不迭代数组的情况下删除特定的孩子？我知道我们可以使用：

Array.prototype.splice()

如果我们想要移除，例如，这个对象（截图#1），我们可以获取它的索引并使用 splice()。

但如果我想删除深度嵌套的对象，我不想迭代数组并使用 splice()，因为性能原因。

在我的控制台中我只得到：

Object { name: "Node-8-6-2", menu: false, $$hashKey: "object:151" }

而且我无权访问父数组的节点。而且我需要迭代所有数组，以便我可以删除它。

有人知道这个问题的解决方法吗？

【问题讨论】：

对象中是否有要删除的索引属性
不，只有$index，但在这里不起作用，因为我们有很多嵌套数组。例如，我将拥有该特定 ID。如何使用它删除元素？

标签： javascript arrays angularjs object

【解决方案1】：

这是您的 plunker 更新。 http://jsfiddle.net/marduke182/uXbn6/2828/

小的变化是：

使用 parentNodes 添加对对象的父引用。

 $scope.add = function(data) {
        var post = data.nodes.length + 1;
        var newName = data.name + '-' + post;
        data.nodes.push({name: newName,nodes: [], parentNodes: data.nodes});
    };

创建方法删除节点并传递$index，给给index属性的父节点做拼接：

   $scope.delete_node = function(data, index) {
        data.parentNodes.splice(index, 1);
    };

将新方法添加到模板中：

<script type="text/ng-template"  id="tree_item_renderer.html">
    {{data.name}}
    <button ng-click="add(data)">Add node</button>
    <button ng-click="delete(data)" ng-show="data.nodes.length > 0">Delete nodes</button>
    <button ng-click="delete_node(data, $index)" >Delete node {{$index}}</button>
    <ul>
        <li ng-repeat="data in data.nodes" ng-include="'tree_item_renderer.html'"></li>
    </ul>
</script>

【讨论】：

【解决方案2】：

在构建嵌套树时，可以向数组添加parent 属性：

var parentNode = [];
var node = [];
node.parent = parentNode;
parentNode.push(node);

现在，如果你想删除node，你可以说：

var index = node.parent.indexOf(node);
node.parent.splice(index, 1);

【讨论】：