Help needed with an object prepare to ng-repeat

Dashboard
1

Hi I have problem with create object to use it with ng-repeat in template node.
My msg.payload looks like that:

{"Typ zasilacza":60181,
"Nr seryjny":12338,
"Wersja FW":1.36,
"Temperatura-w":24,
"V-Set":13.1,
"I-Set":1.8,
"Napięcie":0,
"Natężenie":0,
"V-Input":48.17,
"Klawiatura":"Odblokowana",
"ERROR":"Jest OK",
"Tryb zasilania":"Stałe napięcie",
"Wyjście":"Wyłączone",
"DATA USE":0,
"Bateria":"Brak",
"V-BATT":0.01,
"Temperatura-z":19,
"year":2020,
"Month":1,
"Day":1,
"hour":12,
"minute":18,
"secunde":41,
"Output V Zero":23,
"Output V scale":23373,
"Back V Zero":21,
"Back V scale":17160,
"Output I zero":296,
"Output I scale":8296,
"Back I scale":62,
"Back I zero":4961,
"Take OK OPZ":1,
"Take OUT OPZ":0,
"Boot pwr OPZ":0,
"Buzzer OPZ":0,
"Logo OPZ":0,
"Język":0,
"Podświetlenie":4,
"DATA0 V-SET":1310,
"DATA0 I-SET":180,
"DATA0 S-VOP":6200,
"DATA0 S-OCP":1820,
"DATA1 V-SET":500,
"DATA1 I-SET":1810,
"DATA1 S-VOP":6200,
"DATA1 S-OCP":1820,
"DATA2 V-SET":330,
"DATA2 I-SET":1810,
"DATA2 S-VOP":6200,
"DATA2 S-OCP":1820,
"DATA3 V-SET":500,
"DATA3 I-SET":1810,
"DATA3 S-VOP":6200,
"DATA3 S-OCP":1820,
"DATA4 V-SET":500,
"DATA4 I-SET":1810,
"DATA4 S-VOP":6200,
"DATA4 S-OCP":1820,
"DATA5 V-SET":500,
"DATA5 I-SET":1810,
"DATA5 S-VOP":6200,
"DATA5 S-OCP":1820,
"DATA6 V-SET":500,
"DATA6 I-SET":1810,
"DATA6 S-VOP":6200,
"DATA6 S-OCP":1820,
"DATA7 V-SET":500,
"DATA7 I-SET":1810,
"DATA7 S-VOP":6200,
"DATA7 S-OCP":1820,
"DATA8 V-SET":500,
"DATA8 I-SET":1810,
"DATA8 S-VOP":6200,
"DATA8 S-OCP":1820,
"DATA9 V-SET":500,
"DATA9 I-SET":1810,
"DATA9 S-VOP":6200,
"DATA9 S-OCP":1820,
"Power":0,
"Amperogodziny":0,
"Watogodziny":0}

Its simple Key Value pair object with DATA0 to DATA9 I'd like to show it on dashboard using template node and ng-repeat. I need to display something as 9x4 table:
DATA0 V-Set I-Set S-VOP S-OCP
DATA1
DATA2.....
I don't know how to parse my msg.paylad to get formatted object like:
{"DATA0":{"DATA0 V-SET":500,"DATA0 I-SET": 1810,"DATA0 S-VOP":6200,"DATA0 S-OCP":1820}} It should be not so hart to iterate, but unfortunately not for me :slight_smile:

2

You need to get your data in to an array to make life easier with ng-repeat

{
rest of object,
"data":[
    {
    "V-SET":1310,
    "I-SET":180,
    "S-VOP":6200,
    "S-OCP":1820
    },
    {
    "V-SET":500,
    "I-SET":1810,
    "S-VOP":6200,
    "S-OCP":1820
    }
}

Then you can iterate over msg.payload.data

But without knowing how you wish to display yor data it makes it difficult to advise with any certainty.

3

Angular's ng-repeat can iterate through an object

<div ng-repeat="(key, value) in myObj"> ... </div>

  1. You want only the key/values starting with the word DATA from your object ?
  2. Why do you want to restructure the data in the new format you posted ?
    wouldn't that make it even more complex for ng-repeat to loop through it ?

Try this if its useful or if it gives you some ideas:

[{"id":"fd8f08d0bb7747d4","type":"inject","z":"54efb553244c241f","name":"data","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"Typ zasilacza\":60181, \"Nr seryjny\":12338, \"Wersja FW\":1.36, \"Temperatura-w\":24, \"V-Set\":13.1, \"I-Set\":1.8, \"Napięcie\":0, \"Natężenie\":0, \"V-Input\":48.17, \"Klawiatura\":\"Odblokowana\", \"ERROR\":\"Jest OK\", \"Tryb zasilania\":\"Stałe napięcie\", \"Wyjście\":\"Wyłączone\", \"DATA USE\":0, \"Bateria\":\"Brak\", \"V-BATT\":0.01, \"Temperatura-z\":19, \"year\":2020, \"Month\":1, \"Day\":1, \"hour\":12, \"minute\":18, \"secunde\":41, \"Output V Zero\":23, \"Output V scale\":23373, \"Back V Zero\":21, \"Back V scale\":17160, \"Output I zero\":296, \"Output I scale\":8296, \"Back I scale\":62, \"Back I zero\":4961, \"Take OK OPZ\":1, \"Take OUT OPZ\":0, \"Boot pwr OPZ\":0, \"Buzzer OPZ\":0, \"Logo OPZ\":0, \"Język\":0, \"Podświetlenie\":4, \"DATA0 V-SET\":1310, \"DATA0 I-SET\":180, \"DATA0 S-VOP\":6200, \"DATA0 S-OCP\":1820, \"DATA1 V-SET\":500, \"DATA1 I-SET\":1810, \"DATA1 S-VOP\":6200, \"DATA1 S-OCP\":1820, \"DATA2 V-SET\":330, \"DATA2 I-SET\":1810, \"DATA2 S-VOP\":6200, \"DATA2 S-OCP\":1820, \"DATA3 V-SET\":500, \"DATA3 I-SET\":1810, \"DATA3 S-VOP\":6200, \"DATA3 S-OCP\":1820, \"DATA4 V-SET\":500, \"DATA4 I-SET\":1810, \"DATA4 S-VOP\":6200, \"DATA4 S-OCP\":1820, \"DATA5 V-SET\":500, \"DATA5 I-SET\":1810, \"DATA5 S-VOP\":6200, \"DATA5 S-OCP\":1820, \"DATA6 V-SET\":500, \"DATA6 I-SET\":1810, \"DATA6 S-VOP\":6200, \"DATA6 S-OCP\":1820, \"DATA7 V-SET\":500, \"DATA7 I-SET\":1810, \"DATA7 S-VOP\":6200, \"DATA7 S-OCP\":1820, \"DATA8 V-SET\":500, \"DATA8 I-SET\":1810, \"DATA8 S-VOP\":6200, \"DATA8 S-OCP\":1820, \"DATA9 V-SET\":500, \"DATA9 I-SET\":1810, \"DATA9 S-VOP\":6200, \"DATA9 S-OCP\":1820, \"Power\":0, \"Amperogodziny\":0, \"Watogodziny\":0}","payloadType":"json","x":250,"y":1020,"wires":[["35f6fe0cbbd0551e","9c03b194b719ea94"]]},{"id":"35f6fe0cbbd0551e","type":"function","z":"54efb553244c241f","name":"filter","func":"\n\nmsg.payload = Object.fromEntries(\n    Object.entries(msg.payload).filter(([key, value]) => /DATA\\d/.test(key)))\n\n    \nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":410,"y":1020,"wires":[["28fbd96398d9e1dc"]]},{"id":"28fbd96398d9e1dc","type":"ui_template","z":"54efb553244c241f","group":"397fec83949c5c0b","name":"","order":2,"width":0,"height":0,"format":"<div ng-repeat=\"(key, value) in msg.payload\">{{key}} : {{value}}</div>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","className":"","x":600,"y":1020,"wires":[["208bfc0ee1b412b3"]]},{"id":"208bfc0ee1b412b3","type":"debug","z":"54efb553244c241f","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":780,"y":1020,"wires":[]},{"id":"9c03b194b719ea94","type":"debug","z":"54efb553244c241f","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":410,"y":920,"wires":[]},{"id":"397fec83949c5c0b","type":"ui_group","name":"PDF Report","tab":"a3a053c01a1ffc93","order":1,"disp":true,"width":"20","collapse":false,"className":""},{"id":"a3a053c01a1ffc93","type":"ui_tab","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]

ps. its not gonna get html design award of the year :wink:

4

Yes. I want exactly these data but I want display it with 10x4 format:

DATA      V-Set     I-Set   S-VOP      S-OCP
DATA0     500       1810    6200        1820
DATA1     500       1100    6200        1232
------------------------------------------------------
DATA9     400       1232    2123        1232

So should be 10 rows and 4 columns since DATA0 to DATA9
If easier way is create new object with formatted data as E1cid than trying straight to ng-repeat. Tried plenty times make a "for loop" but without success.
Of course I could a write function node with ugly and dirty manual data placing, but that will be the last resort

5

i was going to ask about that ..

Are the values DATA0 ~> DATA9 always present in your object ?
or could it be in some case that you have less values like DATA0 ~> DATA5 ?
that would require a more dynamic JS way of restructuring the data

6

Always data present at the same place with all key value pair. Its modbus data from Riden RD6018 power supply device.

7

example

[{"id":"fd8f08d0bb7747d4","type":"inject","z":"c791cbc0.84f648","name":"data","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"Typ zasilacza\":60181, \"Nr seryjny\":12338, \"Wersja FW\":1.36, \"Temperatura-w\":24, \"V-Set\":13.1, \"I-Set\":1.8, \"Napięcie\":0, \"Natężenie\":0, \"V-Input\":48.17, \"Klawiatura\":\"Odblokowana\", \"ERROR\":\"Jest OK\", \"Tryb zasilania\":\"Stałe napięcie\", \"Wyjście\":\"Wyłączone\", \"DATA USE\":0, \"Bateria\":\"Brak\", \"V-BATT\":0.01, \"Temperatura-z\":19, \"year\":2020, \"Month\":1, \"Day\":1, \"hour\":12, \"minute\":18, \"secunde\":41, \"Output V Zero\":23, \"Output V scale\":23373, \"Back V Zero\":21, \"Back V scale\":17160, \"Output I zero\":296, \"Output I scale\":8296, \"Back I scale\":62, \"Back I zero\":4961, \"Take OK OPZ\":1, \"Take OUT OPZ\":0, \"Boot pwr OPZ\":0, \"Buzzer OPZ\":0, \"Logo OPZ\":0, \"Język\":0, \"Podświetlenie\":4, \"DATA0 V-SET\":1310, \"DATA0 I-SET\":180, \"DATA0 S-VOP\":6200, \"DATA0 S-OCP\":1820, \"DATA1 V-SET\":500, \"DATA1 I-SET\":1810, \"DATA1 S-VOP\":6200, \"DATA1 S-OCP\":1820, \"DATA2 V-SET\":330, \"DATA2 I-SET\":1810, \"DATA2 S-VOP\":6200, \"DATA2 S-OCP\":1820, \"DATA3 V-SET\":500, \"DATA3 I-SET\":1810, \"DATA3 S-VOP\":6200, \"DATA3 S-OCP\":1820, \"DATA4 V-SET\":500, \"DATA4 I-SET\":1810, \"DATA4 S-VOP\":6200, \"DATA4 S-OCP\":1820, \"DATA5 V-SET\":500, \"DATA5 I-SET\":1810, \"DATA5 S-VOP\":6200, \"DATA5 S-OCP\":1820, \"DATA6 V-SET\":500, \"DATA6 I-SET\":1810, \"DATA6 S-VOP\":6200, \"DATA6 S-OCP\":1820, \"DATA7 V-SET\":500, \"DATA7 I-SET\":1810, \"DATA7 S-VOP\":6200, \"DATA7 S-OCP\":1820, \"DATA8 V-SET\":500, \"DATA8 I-SET\":1810, \"DATA8 S-VOP\":6200, \"DATA8 S-OCP\":1820, \"DATA9 V-SET\":500, \"DATA9 I-SET\":1810, \"DATA9 S-VOP\":6200, \"DATA9 S-OCP\":1820, \"Power\":0, \"Amperogodziny\":0, \"Watogodziny\":0}","payloadType":"json","x":150,"y":4240,"wires":[["35f6fe0cbbd0551e"]]},{"id":"35f6fe0cbbd0551e","type":"function","z":"c791cbc0.84f648","name":"filter","func":"\nmsg.payload.data =[]\nfor(const key in msg.payload){\n    if( key.substr(0,4) === \"DATA\" && key != \"DATA USE\"){\n        let key_obj = key.split(\" \");\n        const key_index = Number(key_obj[0].substr(4));\n        key_obj = key_obj[1];\n        if(!msg.payload.data[key_index]){\n            msg.payload.data[key_index] = {};\n        }\n\n        msg.payload.data[key_index][key_obj] = msg.payload[key];\n    }\n}\n\n    \nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":290,"y":4240,"wires":[["28fbd96398d9e1dc","208bfc0ee1b412b3"]]},{"id":"28fbd96398d9e1dc","type":"ui_template","z":"c791cbc0.84f648","group":"b9d366f18ff7ae74","name":"","order":2,"width":0,"height":0,"format":"<table>\n    <tr>\n        <th ng-repeat=\"(key,val) in msg.payload.data[0]\">{{key}}</th>\n    </tr>\n    <tr ng-repeat=\"row in msg.payload.data\">\n        <td ng-repeat=\"element in row\">{{element}}\n    </tr>\n</table>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","className":"","x":470,"y":4240,"wires":[[]]},{"id":"208bfc0ee1b412b3","type":"debug","z":"c791cbc0.84f648","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":490,"y":4340,"wires":[]},{"id":"b9d366f18ff7ae74","type":"ui_group","name":"test","tab":"ffba43d73860d25d","order":1,"disp":true,"width":12,"collapse":false},{"id":"ffba43d73860d25d","type":"ui_tab","name":"Level","icon":"dashboard","order":3,"disabled":false,"hidden":false}]

[edit] Here is updated code . I have added the first column data and delete old object values.

[{"id":"fd8f08d0bb7747d4","type":"inject","z":"c791cbc0.84f648","name":"data","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"Typ zasilacza\":60181, \"Nr seryjny\":12338, \"Wersja FW\":1.36, \"Temperatura-w\":24, \"V-Set\":13.1, \"I-Set\":1.8, \"Napięcie\":0, \"Natężenie\":0, \"V-Input\":48.17, \"Klawiatura\":\"Odblokowana\", \"ERROR\":\"Jest OK\", \"Tryb zasilania\":\"Stałe napięcie\", \"Wyjście\":\"Wyłączone\", \"DATA USE\":0, \"Bateria\":\"Brak\", \"V-BATT\":0.01, \"Temperatura-z\":19, \"year\":2020, \"Month\":1, \"Day\":1, \"hour\":12, \"minute\":18, \"secunde\":41, \"Output V Zero\":23, \"Output V scale\":23373, \"Back V Zero\":21, \"Back V scale\":17160, \"Output I zero\":296, \"Output I scale\":8296, \"Back I scale\":62, \"Back I zero\":4961, \"Take OK OPZ\":1, \"Take OUT OPZ\":0, \"Boot pwr OPZ\":0, \"Buzzer OPZ\":0, \"Logo OPZ\":0, \"Język\":0, \"Podświetlenie\":4, \"DATA0 V-SET\":1310, \"DATA0 I-SET\":180, \"DATA0 S-VOP\":6200, \"DATA0 S-OCP\":1820, \"DATA1 V-SET\":500, \"DATA1 I-SET\":1810, \"DATA1 S-VOP\":6200, \"DATA1 S-OCP\":1820, \"DATA2 V-SET\":330, \"DATA2 I-SET\":1810, \"DATA2 S-VOP\":6200, \"DATA2 S-OCP\":1820, \"DATA3 V-SET\":500, \"DATA3 I-SET\":1810, \"DATA3 S-VOP\":6200, \"DATA3 S-OCP\":1820, \"DATA4 V-SET\":500, \"DATA4 I-SET\":1810, \"DATA4 S-VOP\":6200, \"DATA4 S-OCP\":1820, \"DATA5 V-SET\":500, \"DATA5 I-SET\":1810, \"DATA5 S-VOP\":6200, \"DATA5 S-OCP\":1820, \"DATA6 V-SET\":500, \"DATA6 I-SET\":1810, \"DATA6 S-VOP\":6200, \"DATA6 S-OCP\":1820, \"DATA7 V-SET\":500, \"DATA7 I-SET\":1810, \"DATA7 S-VOP\":6200, \"DATA7 S-OCP\":1820, \"DATA8 V-SET\":500, \"DATA8 I-SET\":1810, \"DATA8 S-VOP\":6200, \"DATA8 S-OCP\":1820, \"DATA9 V-SET\":500, \"DATA9 I-SET\":1810, \"DATA9 S-VOP\":6200, \"DATA9 S-OCP\":1820, \"Power\":0, \"Amperogodziny\":0, \"Watogodziny\":0}","payloadType":"json","x":150,"y":4240,"wires":[["35f6fe0cbbd0551e"]]},{"id":"35f6fe0cbbd0551e","type":"function","z":"c791cbc0.84f648","name":"filter","func":"\nmsg.payload.data =[]\nfor(const key in msg.payload){\n    if( key.substr(0,4) === \"DATA\" && key != \"DATA USE\"){\n        let key_obj = key.split(\" \");\n        const key_index = Number(key_obj[0].substr(4));\n        key_obj = key_obj[1];\n        if(!msg.payload.data[key_index]){\n            msg.payload.data[key_index] = {\"DATA\": \"DATA\" + key_index};\n        }\n        msg.payload.data[key_index][key_obj] = msg.payload[key];\n        delete msg.payload[key];\n    }\n}\n\n    \nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":290,"y":4240,"wires":[["28fbd96398d9e1dc","208bfc0ee1b412b3"]]},{"id":"28fbd96398d9e1dc","type":"ui_template","z":"c791cbc0.84f648","group":"b9d366f18ff7ae74","name":"","order":2,"width":0,"height":0,"format":"<table>\n    <tr>\n        <th ng-repeat=\"(key,val) in msg.payload.data[0]\">{{key}}</th>\n    </tr>\n    <tr ng-repeat=\"row in msg.payload.data\">\n        <td ng-repeat=\"element in row\">{{element}}\n    </tr>\n</table>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","className":"","x":470,"y":4240,"wires":[[]]},{"id":"208bfc0ee1b412b3","type":"debug","z":"c791cbc0.84f648","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":490,"y":4340,"wires":[]},{"id":"b9d366f18ff7ae74","type":"ui_group","name":"test","tab":"ffba43d73860d25d","order":1,"disp":true,"width":12,"collapse":false},{"id":"ffba43d73860d25d","type":"ui_tab","name":"Level","icon":"dashboard","order":3,"disabled":false,"hidden":false}]
1 Like
8

VERY BIG THANKS !! E1cid I tried to write the a function like yours almost three days!!. Now I will spend the next two analyzing your code. :slight_smile:
Once again Very Thx for an updated version too. That is exactly as I wanted.

9

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.