Parsing Text (pure String of unknown object), Convert to JSON and extract Values As Map (Key/Value) in Angular

user_1410223 0
Viewed 30

I have a Text like is shown (After, I removed Backslashes, and I beauty JSON Formmatter)

[
    {
        "id": "c76f1e77",
        "formName": "Form Name",
        "description": "Set Form description",
        "dependences": [],
        "action": 0,
        "visible": true,
        "horzs": [
            {
                "id": "425c007a",
                "verts": [
                    {
                        "id": "934fc845",
                        "cell": {
                            "id": "FieldText",
                            "name": "FieldText",
                            "description": "Description of FieldText",
                            "isRequired": true,
                            "isSensible": false,
                            "action": 0,
                            "control": {
                                "name": "Text",
                                "description": "Text Field",
                                "typeData": "text",
                                "tag": "input"
                            },
                            "dependences": [],
                            "rule": null,
                            "ruleMessage": null
                        }
                    },
                    {
                        "id": "9462ee7d",
                        "cell": {
                            "id": "FieldNumber",
                            "name": "FieldNumber",
                            "description": "Description of Field",
                            "isRequired": true,
                            "isSensible": false,
                            "action": 0,
                            "control": {
                                "name": "Numeric",
                                "description": "Number Field",
                                "typeData": "number",
                                "tag": "input"
                            },
                            "dependences": [],
                            "rule": null,
                            "ruleMessage": null
                        }
                    },
                    {
                        "id": "bd1ad77b",
                        "cell": {
                            "id": "FieldPassword",
                            "name": "FieldPassword",
                            "description": "Description of Field",
                            "isRequired": true,
                            "isSensible": false,
                            "action": 0,
                            "control": {
                                "name": "Password",
                                "description": "Password Field",
                                "typeData": "password",
                                "tag": "input"
                            },
                            "dependences": [],
                            "rule": null,
                            "ruleMessage": null
                        }
                    }
                ]
            }
        ]
    },
    {
        "id": "188dc0f3",
        "formName": "Form Name",
        "description": "Set Form description",
        "dependences": [],
        "action": 0,
        "visible": true,
        "horzs": [
            {
                "id": "d4fe409f",
                "verts": [
                    {
                        "id": "617ba39c",
                        "cell": {
                            "id": "FieldDate",
                            "name": "FieldDate",
                            "description": "Description of Field",
                            "isRequired": true,
                            "isSensible": false,
                            "action": 0,
                            "control": {
                                "name": "Date",
                                "description": "Date Field",
                                "typeData": "date",
                                "tag": "input"
                            },
                            "dependences": [],
                            "rule": null,
                            "ruleMessage": null
                        }
                    },
                    {
                        "id": "9a93e4e3",
                        "cell": {
                            "id": "FieldTime",
                            "name": "FieldTime",
                            "description": "Description of Field",
                            "isRequired": true,
                            "isSensible": false,
                            "action": 0,
                            "control": {
                                "name": "Time",
                                "description": "Time Field",
                                "typeData": "time",
                                "tag": "input"
                            },
                            "dependences": [],
                            "rule": null,
                            "ruleMessage": null
                        }
                    },
                    {
                        "id": "43bd5654",
                        "cell": {
                            "id": "FieldCheckBox",
                            "name": "FieldCheckBox",
                            "description": "Description of Field",
                            "isRequired": true,
                            "isSensible": false,
                            "action": 0,
                            "control": {
                                "name": "Checkbox",
                                "description": "Boolean Field",
                                "typeData": "checkbox",
                                "tag": "input"
                            },
                            "dependences": [],
                            "rule": null,
                            "ruleMessage": null
                        }
                    },
                    {
                        "id": "d617f5c6",
                        "cell": {
                            "id": "FieldRadio",
                            "name": "FieldRadio",
                            "description": "Description of Field",
                            "isRequired": true,
                            "isSensible": false,
                            "action": 0,
                            "control": {
                                "options": [
                                    {
                                        "id": "Radio1",
                                        "value": "Radio1"
                                    },
                                    {
                                        "id": "Radio2",
                                        "value": "Radio2"
                                    },
                                    {
                                        "id": "Radio3",
                                        "value": "Radio3"
                                    }
                                ],
                                "name": "Radio",
                                "description": "Select Boolean Field",
                                "typeData": "radio",
                                "tag": "input"
                            },
                            "dependences": [],
                            "rule": null,
                            "ruleMessage": null
                        }
                    }
                ]
            }
        ]
    },
    {
        "id": "82c2a63a",
        "formName": "Form Name",
        "description": "Set Form description",
        "dependences": [],
        "action": 0,
        "visible": true,
        "horzs": [
            {
                "id": "e9f242de",
                "verts": [
                    {
                        "id": "8b75def6",
                        "cell": {
                            "id": "FieldList",
                            "name": "FieldList",
                            "description": "Description of Field",
                            "isRequired": true,
                            "isSensible": false,
                            "action": 0,
                            "control": {
                                "options": [
                                    {
                                        "id": "Item1",
                                        "value": "Item1"
                                    },
                                    {
                                        "id": "Item2",
                                        "value": "Item2"
                                    },
                                    {
                                        "id": "Item3",
                                        "value": "Item3"
                                    }
                                ],
                                "name": "List de Opciones",
                                "description": "List Field",
                                "tag": "list"
                            },
                            "dependences": [],
                            "rule": null,
                            "ruleMessage": null
                        }
                    },
                    {
                        "id": "15e4eef5",
                        "cell": {
                            "id": "FieldSelect",
                            "name": "FieldSelect",
                            "description": "Description of Field",
                            "isRequired": true,
                            "isSensible": false,
                            "action": 0,
                            "control": {
                                "options": [
                                    {
                                        "id": "Select1",
                                        "value": "Select1"
                                    },
                                    {
                                        "id": "Select2",
                                        "value": "Select2"
                                    }
                                ],
                                "name": "List de Opciones",
                                "description": "Selection Field",
                                "tag": "select"
                            },
                            "dependences": [],
                            "rule": null,
                            "ruleMessage": null
                        }
                    },
                    {
                        "id": "5c50c048",
                        "cell": {
                            "id": "FieldTextArea",
                            "name": "FieldTextArea",
                            "description": "Description of Field",
                            "isRequired": true,
                            "isSensible": false,
                            "action": 0,
                            "control": {
                                "name": "Text",
                                "description": "TextArea Field",
                                "typeData": "text",
                                "tag": "input"
                            },
                            "dependences": [],
                            "rule": null,
                            "ruleMessage": null
                        }
                    }
                ]
            }
        ]
    }
]

As you can see, first is an array, with a unknown objects. Each Object has an Array named "horzs", inside of each horz, there is an array named "verts". And inside of each vert there is an object named "cell" And each cell has a name property and control properties and others.

Now I need to extract from this text, All possible Value-Key pair: name as Key and control as Value... or name as Key and cell as Value...

I was trying with in https://jsonpath.com/

As Key $[1].horzs[0].verts[1].cell.name I got:

[
  "FieldTime"
]

As Value $[1].horzs[0].verts[1].cell.control I got:

[
  {
    "name": "Time",
    "description": "Time Field",
    "typeData": "time",
    "tag": "input"
  }
]

Now testing $[1].horzs[0].verts.length I got:

[
  4
]

Now, I need to store All in a dictionary/Map ()

I was trying with my text, but I can't use for each for a String How to do it?

angular key-value parsing json
1 Answers

Install

npm i jsonpath-plus

In your App

import {JSONPath} from 'jsonpath-plus';

Bulky and Ugly code

let map = new Map();
if (source) {
    const items = +JSONPath({path: '$.length', json: source});
    console.log('items:' + items);
    if (items) {
        for (let i = 0; i < items; i++) {
            const horzsPrefix = '$['+i+'].horzs';
            //console.log(horzsPrefix+'.length');
            const horzs = +JSONPath({path: horzsPrefix+'.length', json: source});
            //console.log('\thorzs:' + horzs);
            for (let r = 0; r < horzs; r++) {
                const vertsPrefix = horzsPrefix +'['+r+'].verts' ;
                //console.log(vertsPrefix+'.length');
                const verts = +JSONPath({path: vertsPrefix+'.length', json: source});
                //console.log('\t\tverts:' + verts);
                for (let c = 0; c < verts; c++) {
                    const cellPrefix = vertsPrefix + '['+c+'].cell' ;
                    const namePrefix = cellPrefix + '.name' ;
                    //console.log(cellPrefix);
                    const cell = JSONPath({path: cellPrefix, json: source});
                    //console.log('\t\t\tcell:' + cell);
                    const name = JSONPath({path: namePrefix, json: source});
                    console.log('name:' + name);
                    console.log('cell:');
                    console.log(cell);
                    map.set(name, cell);
                }
            }
        }
    }
}
console.log('map:');
console.log(map);

Changing the strings

  if (source) {
    const items = +JSONPath({path: '$.length', json: source});
    if (items) {
      for (let item = 0; item < items; item++) {
        const horzsPrefix = `$[${item}].horzs`;
        const horzs = +JSONPath({path: `${horzsPrefix}.length`, json: source});
        for (let horz = 0; horz < horzs; horz++) {
          const vertsPrefix = `${horzsPrefix}[${horz}].verts`;
          const verts = +JSONPath({path: `${vertsPrefix}.length`, json: source});
          for (let vert = 0; vert < verts; vert++) {
            const cellPrefix = `${vertsPrefix}[${vert}].cell`;
            const namePrefix = `${cellPrefix}.name`
            const cell = JSONPath({path: cellPrefix, json: source});
            const name = JSONPath({path: namePrefix, json: source});
            console.log('name:');
            console.log(name);
            console.log('cell:');
            console.log(cell);
          }
        }

      }
    }
  }

Alternatively, and Easy is using $...cell and $...cell.name

user_8112930
Related