如何从 JavaScript 中的嵌套对象列表中删除对象？

Question

我正在使用 bootstrap treeview.js 来创建树结构。我已经对此进行了修改并创建了 2 个 btns 用于添加和删除新条目。 添加测试条目后，这是我创建树的输出 JSON

[ 
   { 
      "nodes":[ 

      ],
      "tag_type":"parent",
      "name":"System Summary",
      "id":"XS1025",
      "desc":"KPI\"s for System Summary"
   },
   { 
      "nodes":[ 
         { 
            "nodes":[ 

            ],
            "tag_type":"child",
            "name":"Network",
            "id":"XS1026",
            "desc":"KPI\"s for Network"
         },
         { 
            "nodes":[ 

            ],
            "tag_type":"parent",
            "name":"test1",
            "id":"t1234",
            "desc":"davjwd we "
         }
      ],
      "tag_type":"parent",
      "name":"Monthly CMTS Summary",
      "id":"RS1001",
      "desc":"KPI\"s for Monthly CMTS Summary"
   }
]

现在对于删除，我得到了用户要删除的选定 ID。但无法从 JSON 中删除它。 下面是我正在尝试的代码。

deleteNodeFromKpiListData(nodeData: any, nodeId: any): void {
    //nodeData is a single object entry for recursively called function, and nodeId is the selected ID
    for (const [key, result] of Object.entries(nodeData)) {
        if (result['id'] === nodeId) {
            // Here I was trying to delete the objkect from actual JSON
            break;
        } else if (result['nodes'].length > 0) {
            this.deleteNodeFromKpiListData(result['nodes'], nodeId);
        }
    }
}

我尝试过 .filter() 和 .splice() 方法从数组中删除对象。但它工作不正常。 示例：如果用户选择删除“test”，则 nodeId = “t1234” 并且 JSON 将为

[ 
   { 
      "nodes":[ 

      ],
      "tag_type":"parent",
      "name":"System Summary",
      "id":"XS1025",
      "desc":"KPI\"s for System Summary"
   },
   { 
      "nodes":[ 
         { 
            "nodes":[ 

            ],
            "tag_type":"child",
            "name":"Network",
            "id":"XS1026",
            "desc":"KPI\"s for Network"
         }
      ],
      "tag_type":"parent",
      "name":"Monthly CMTS Summary",
      "id":"RS1001",
      "desc":"KPI\"s for Monthly CMTS Summary"
   }
]

这是一个带有 typescript 的 Angular 项目。但是 JavaScript 代码也会有很大的帮助。

Answer 1

我已经删除了节点元素，但它是未定义的。从列表中删除未定义。

var data = [
   {
      "nodes":[

      ],
      "tag_type":"parent",
      "name":"System Summary",
      "id":"XS1025",
      "desc":"KPI\"s for System Summary"
   },
   {
      "nodes":[
         {
            "nodes":[

            ],
            "tag_type":"child",
            "name":"Network",
            "id":"XS1026",
            "desc":"KPI\"s for Network"
         },
         {
            "nodes":[

            ],
            "tag_type":"parent",
            "name":"test1",
            "id":"t1234",
            "desc":"davjwd we "
         }
      ],
      "tag_type":"parent",
      "name":"Monthly CMTS Summary",
      "id":"RS1001",
      "desc":"KPI\"s for Monthly CMTS Summary"
   }
];
function removeElementById(data_array,node_id){
  for(var a=0;a<data_array.length;a++){
    if(data_array[a]["id"]===(node_id)){
      delete data_array[a];
      var tempData = data_array.filter(function(d){
        return d!=null || d!=undefined;
      })
    }else if(data_array[a]["nodes"].length>0){
      removeElementById(data_array[a]["nodes"],node_id);
    }
  }
}
removeElementById(data,"t1234");
console.log(data);

Answer 2

您可以使用循环过滤内部节点并推入一个新数组！

let myObj = [
    {
        "nodes": [

        ],
        "tag_type": "parent",
        "name": "System Summary",
        "id": "XS1025",
        "desc": "KPI\"s for System Summary"
    },
    {
        "nodes": [
            {
                "nodes": [

                ],
                "tag_type": "child",
                "name": "Network",
                "id": "XS1026",
                "desc": "KPI\"s for Network"
            },
            {
                "nodes": [

                ],
                "tag_type": "parent",
                "name": "test1",
                "id": "t1234",
                "desc": "davjwd we "
            }
        ],
        "tag_type": "parent",
        "name": "Monthly CMTS Summary",
        "id": "RS1001",
        "desc": "KPI\"s for Monthly CMTS Summary"
    }
];


let myObjNew = [];
for (let i = 0; i < myObj.length; i++) {

    let myinner = myObj[i];
    let nodeObj = myObj[i]['nodes'];
    let nodeOnly = nodeObj.filter((item) => !item['id'].includes('t1234'));

    myinner.nodes = nodeOnly;
    myObjNew.push(myinner);


}
console.log(myObjNew)

你的样子很像

deleteNodeFromKpiListData(nodeData: any, nodeId: any): void {
    let myObjNew = [];
    for (let i = 0; i < nodeData.length; i++) {

        let myinner = nodeData[i];
        let nodeObj = nodeData[i]['nodes'];
        let nodeOnly = nodeObj.filter((item) => !item['id'].includes('t1234'));

        myinner.nodes = nodeOnly;
        myObjNew.push(myinner);

    }
    this.nodeData = myObjNew;
}