Prime tree: circular issue when pushing child

[primeTreeClimber23]

Hi there!

I'm currently fiddling with PrimeNG tree and encountered an issue when pushing a child to a respective tree node.
This happens as I push a child to the 1st level node as seen in the image below:

core.mjs:6468 ERROR TypeError: Converting circular structure to JSON
--> starting at object with constructor 'Object'
| property 'children' -> object with constructor 'Array'
| index 0 -> object with constructor 'Object'
--- property 'parent' closes the circle
at JSON.stringify (<anonymous>)

Here's the structure



In my main.component.ts I have the following..

A designTemplateObject for a tree-node:

Code: Select all

{
   "label": data.name,
   "data": data.typeOfNode,
   "type": "rootNode",
   "icon": "pi pi-home",
   "key":Date.now(),
   "draggable":false,
   "children": []
}

A recursive function for adding a child to a node via forEach:

Code: Select all

addNodeByKey(treeData:any, keyOfNode:any, childData:any){
   console.log('Adding node by key:' , keyOfNode);
   treeData.forEach((obj:any) => {
      if (obj.key == keyOfNode) {
         console.log('Match found..');
         obj.children.push(childData);
      }
      else {
         console.log('No Match found - recursing..');
         [...obj.children] = this.addNodeByKey(obj.children, keyOfNode, childData);
      }
   })
   console.log(`Updated tree:`, treeData);
   console.log(`Updated tree:`, JSON.stringify(treeData));   // -----> Here is the circular error thrown
   return treeData;
}

Here's the stringified data of root and child lvl1:

[{"label":"Some Root Node","data":{"type":{"name":"","value":""},"custom":[]},"type":"rootNode","icon":"pi pi-home","key":1660825707202,"draggable":false,"children":[{"label":"Child Node Lvl 1","data":{"type":{"name":"Organisation","value":"organisation"},"custom":[]},"type":"organisationalNode","formData":[{"id":1660825738792,"datatype":"string","name":"Title","value":"ACME In","isPastOn":false},{"id":1660825738793,"datatype":"integer","name":"Organisation-ID","value":123,"isPastOn":false},{"id":1660825738794,"datatype":"boolean","name":"Active","value":true,"isPastOn":true},{"id":1660825738795,"datatype":"boolean","name":"Logo","value":false,"isPastOn":false},{"id":1660825738796,"datatype":"string","name":"Location of Logo","value":"./src/logo.png","isPastOn":false}],"icon":"pi pi-folder","key":1660825739898,"children":[]}]}]

Thanks for reading - any idea of what's happening here and how to fix it?