从具有父子结构的对象数组中删除对象

时间:2018-08-31 08:49:30

标签: javascript angular typescript tree primeng

嘿,我正在使用PrimeNg UI框架创建Angular应用程序,发现我无法解决的问题。

可以说我有一个对象数组,其中的对象具有以下结构(例如,这是PrimeNg的TreeNode,它是Data下的树组件)。

这是singel节点的外观:

{
    label?: string;
    expandedIcon?: any;
    collapsedIcon?: any;
    children?: TreeNode[];
    parent?: TreeNode;
    id?: number;
}

如您所见,亲子关系正在进行中。

我的数组看起来像这样:

    [
      {     Id: 1,
            label: "Books",
            expandedIcon: "fa fa-folder-open",
            collapsedIcon: "fa fa-folder",
            children: [
                       {
                       Id: 2,
                       label: "Horror",
                       expandedIcon: "fa fa-folder-open",
                       collapsedIcon: "fa fa-folder",
                       children: [{
                                  Id: 3,
                                  label: "Stephen King",
                                  expandedIcon: "fa fa-folder-open",
                                  collapsedIcon: "fa fa-folder",
                                  children: null,
                                  parent: undefiend
                                 }],
                        parent: {label: "Books", expandedIcon: "fa fa-folder-open"...}
                       }
                      ];
            parent: undefined;
      },
      {...}
    ]

现在出现了我的问题:在我的应用程序中,用户可以选择父对象或子对象之一(看起来像Windows资源管理器结构)。如果选择,我想删除该对象。

我的问题是如何在阵列中找到此选定对象?

让我们说所选节点如下。

{
 label: "Stephen King",
 expandedIcon: "fa fa-folder-open",
 collapsedIcon: "fa fa-folder",
 children: null,
 parent: undefiend
}

如何在数组中找到该对象并将其删除?过滤器可以是标签或ID。

1 个答案:

答案 0 :(得分:1)

您可以使用递归函数

    function removeSelectedNode(){
      p.forEach((parent)=>{
        deleteFromTree(parent, p)
        })
    }

    function deleteFromTree(obj, parent){
     console.log("rechived", obj)
      if(obj.Id==selectedNode.Id){
      console.log("found", obj)
        var index = parent.findIndex((o)=> o.Id == obj.Id)
        parent.splice(index,1);
        return;
      }
      if(obj.children && obj.children.length>0){
        obj.children.forEach((child)=>{
           deleteFromTree(child, obj.children);    
        })         
      }
    }

函数中的将p替换为实际数组,然后将selectedNode设置在某处 我已经尝试运行此程序。