Как удалить объект из списка вложенных объектов в 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"
   }
]

сейчас Для удаления я получил выбранный идентификатор, который пользователь хочет удалить. Но не могу удалить его из 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"
   }
]

Это был 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

Вы можете go с помощью al oop и фильтровать внутренние узлы и pu sh в новом массиве!

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;
}