How do I strip this JSON in Angular?

Question

I have a JSON, from which I need to strip down the name and position values of every subFolder to picture the folder structure from inside the JSON in a ngx-treeview in Angular. I only want to have the subFolders, including the templates in the subFolders. Since the structure of the JSON object doesn't exactly match at all places and is not homogenous. How do I dynamically push the subFolder values into the treeview (ngx-treeview) in the exact folder structure from the JSON?

The ngx-treeview JSON should look something like this:

templates = new TreeviewItem({
  text: "Abrechnung",
  value: 1,
  children: [
    {
      text: "Fahrtkosten",
      value: 11,
    },
    {
      text: "Lohn",
      value: 12,
    },
  ],
});

My JSON:

{
  "soap:Envelope": {
    "soap:Body": {
      "ns2:getTemplateTreeResponse": {
        "return": {
          "subFolders": {
            "name": "Vorlagen",
            "description": "",
            "subFolders": {
              "name": "VorlagenB",
              "description": "",
              "subFolders": [
                {
                  "name": "Abrechnung",
                  "description": "",
                  "subFolders": [
                    {
                      "name": "Fahrtkosten",
                      "description": "",
                      "documentTypes": [
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\Fahrtkostenabrechnung.template",
                          "description": "",
                          "metadata": ""
                        },
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\Fahrtkostenzusatz.template",
                          "description": "",
                          "metadata": ""
                        }
                      ]
                    },
                    {
                      "name": "Lohn",
                      "description": "",
                      "documentTypes": [
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\Gehaltsabrechnung.template",
                          "description": "",
                          "metadata": ""
                        },
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\Lohnbescheid.template",
                          "description": "",
                          "metadata": ""
                        }
                      ]
                    }
                  ],
                  "documentTypes": [
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\Fahrtkostenabrechnung.template",
                      "description": "",
                      "metadata": ""
                    },
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\Fahrtkostenzusatz.template",
                      "description": "",
                      "metadata": ""
                    },
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\Gehaltsabrechnung.template",
                      "description": "",
                      "metadata": ""
                    },
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\Lohnbescheid.template",
                      "description": "",
                      "metadata": ""
                    }
                  ]
                },
                {
                  "name": "Datenschutz",
                  "description": "",
                  "subFolders": [
                    {
                      "name": "Datenschutzbeauftragter",
                      "description": "",
                      "documentTypes": [
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungHD.template",
                          "description": "",
                          "metadata": ""
                        },
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungXD.template",
                          "description": "",
                          "metadata": ""
                        }
                      ]
                    },
                    {
                      "name": "Datenschutzerklärung",
                      "description": "",
                      "documentTypes": [
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungKD.template",
                          "description": "",
                          "metadata": ""
                        },
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungMA.template",
                          "description": "",
                          "metadata": ""
                        }
                      ]
                    }
                  ],
                  "documentTypes": [
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungHD.template",
                      "description": "",
                      "metadata": ""
                    },
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungKD.template",
                      "description": "",
                      "metadata": ""
                    },
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungMA.template",
                      "description": "",
                      "metadata": ""
                    },
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungXD.template",
                      "description": "",
                      "metadata": ""
                    }
                  ]
                },
                {
                  "name": "Mitarbeiterinfos",
                  "description": "",
                  "subFolders": {
                    "name": "Urlaub",
                    "description": "",
                    "documentTypes": [
                      {
                        "fullName": "\\library\\MVP\\Template.template",
                        "description": "",
                        "metadata": ""
                      },
                      {
                        "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsantragbescheid.template",
                        "description": "",
                        "metadata": ""
                      }
                    ]
                  },
                  "documentTypes": [
                    {
                      "fullName": "\\library\\MVP\\Template.template",
                      "description": "",
                      "metadata": ""
                    },
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsantragbescheid.template",
                      "description": "",
                      "metadata": ""
                    }
                  ]
                },
                {
                  "name": "Sonstiges",
                  "description": "",
                  "subFolders": [
                    {
                      "name": "Freitext Briefe",
                      "description": "",
                      "documentTypes": [
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\Anschreiben1.template",
                          "description": "",
                          "metadata": ""
                        },
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\Anschreiben2.template",
                          "description": "",
                          "metadata": ""
                        }
                      ]
                    },
                    {
                      "name": "Rückfragen",
                      "description": "",
                      "documentTypes": [
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\Testvorlage.template",
                          "description": "",
                          "metadata": ""
                        },
                        {
                          "fullName": "\\library\\MVP\\Vorlagen\\TestvorlageRgfrage.template",
                          "description": "",
                          "metadata": ""
                        }
                      ]
                    }
                  ],
                  "documentTypes": [
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\Anschreiben1.template",
                      "description": "",
                      "metadata": ""
                    },
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\Anschreiben2.template",
                      "description": "",
                      "metadata": ""
                    },
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\Testvorlage.template",
                      "description": "",
                      "metadata": ""
                    },
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\TestvorlageRgfrage.template",
                      "description": "",
                      "metadata": ""
                    }
                  ]
                },
                {
                  "name": "Urlaub",
                  "description": "",
                  "subFolders": {
                    "name": "Urlaubsantrag",
                    "description": "",
                    "documentTypes": [
                      {
                        "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsanfrage.template",
                        "description": "",
                        "metadata": ""
                      },
                      {
                        "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsantrag.template",
                        "description": "",
                        "metadata": ""
                      }
                    ]
                  },
                  "documentTypes": [
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsanfrage.template",
                      "description": "",
                      "metadata": ""
                    },
                    {
                      "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsantrag.template",
                      "description": "",
                      "metadata": ""
                    }
                  ]
                }
              ],
              "documentTypes": [
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\Anschreiben1.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\Anschreiben2.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungHD.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungKD.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungMA.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungXD.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\Fahrtkostenabrechnung.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\Fahrtkostenzusatz.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\Gehaltsabrechnung.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\Lohnbescheid.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Template.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\Testvorlage.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\TestvorlageRgfrage.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsanfrage.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsantrag.template",
                  "description": "",
                  "metadata": ""
                },
                {
                  "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsantragbescheid.template",
                  "description": "",
                  "metadata": ""
                }
              ]
            },
            "documentTypes": [
              {
                "fullName": "\\library\\MVP\\Vorlagen\\Anschreiben1.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\Anschreiben2.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungHD.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungKD.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungMA.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\DatenschutzerklärungXD.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\Fahrtkostenabrechnung.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\Fahrtkostenzusatz.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\Gehaltsabrechnung.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\Lohnbescheid.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Template.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\Testvorlage.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\TestvorlageRgfrage.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsanfrage.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsantrag.template",
                "description": "",
                "metadata": ""
              },
              {
                "fullName": "\\library\\MVP\\Vorlagen\\Urlaubsantragbescheid.template",
                "description": "",
                "metadata": ""
              }
            ]
          }
        }
      }
    }
  }
}

Answer 1

@evilstiefel was faster than me but I'm with him. Sounds more like a data-transformation issue instead of an Angular one.

See a small StackBlitz sample to see my solution to the problem: https://stackblitz.com/edit/angular-basic-starter-fvewdw?file=src%2Fapp%2Fapp.component.ts

Answer 2

This sounds more like a data analysis problem than an Angular problem. Consider the following helper method that takes your data structure and returns an array which recursively populates a structure that has a folder-name, associated document types and, if present, an array of sub-folders:

const listName = (node: any, aggregate = []): any[] => {
  let documentTypes = [];
  if (node) {
    if (node.documentTypes && node.documentTypes instanceof Array) {
      documentTypes = node.documentTypes.map(docType => docType["fullName"]);
    }
  }
  if (node.subFolders && node.subFolders instanceof Array) {
    return aggregate.concat({
      name: node.name,
      documentTypes,
      subFolders: node.subFolders.map(folder => listName(folder))
    });
  } else if (node.subFolders) {
    return aggregate.concat({
      name: node.name,
      documentTypes,
      subFolders: [listName(node.subFolders, aggregate)]
    });
  } else {
    return aggregate.concat({ name: node.name, documentTypes, subFolders: [] });
  }
};

const tree =
  data["soap:Envelope"]["soap:Body"]["ns2:getTemplateTreeResponse"]["return"][
    "subFolders"
  ];

const structure = listName(tree);

There might very well be a shorter version of this recursive function, but it should give you an idea of how to "destructure" your source JSON. Note that in my example, your json-data was loaded into the variable data.