Iterate through objects to create HTML list


#1

Hi, I am somewhat new to node red and javascript.
I am having trouble with trying to figure out how to loop through and print a list of objects to the browser.
So far, only the first entry is shown, but I would like it to print the results of all the results.

Any assistance would be great.

[{"id":"2d3497a8.39db58","type":"inject","z":"4d5f940a.1aa50c","name":"5 Min Node","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":170,"y":620,"wires":[["7d945de7.ba1754"]]},{"id":"9be0567c.d075b8","type":"csv","z":"4d5f940a.1aa50c","name":"","sep":",","hdrin":true,"hdrout":"","multi":"mult","ret":"\\n","temp":"","skip":"0","x":270,"y":700,"wires":[["6976e284.44b4ac","8b548dc6.d3a5f"]]},{"id":"15ef9947.601807","type":"debug","z":"4d5f940a.1aa50c","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","x":730,"y":700,"wires":[]},{"id":"7d945de7.ba1754","type":"http request","z":"4d5f940a.1aa50c","name":"","method":"GET","ret":"txt","url":"https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/significant_month.csv","tls":"","x":250,"y":660,"wires":[["9be0567c.d075b8"]]},{"id":"8b548dc6.d3a5f","type":"switch","z":"4d5f940a.1aa50c","name":"","property":"payload.mag","propertyType":"msg","rules":[{"t":"gte","v":"5","vt":"num"}],"checkall":"true","repair":false,"outputs":1,"x":450,"y":660,"wires":[["ab61cabb.9761e8"]]},{"id":"ab61cabb.9761e8","type":"change","z":"4d5f940a.1aa50c","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"PANIC!","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":620,"y":660,"wires":[["ce5fa1dd.078d8"]]},{"id":"ce5fa1dd.078d8","type":"debug","z":"4d5f940a.1aa50c","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","x":810,"y":660,"wires":[]},{"id":"9e259618.8947d8","type":"http in","z":"4d5f940a.1aa50c","name":"","url":"/quakes","method":"get","upload":false,"swaggerDoc":"","x":180,"y":860,"wires":[["d3fbe980.526bc8"]]},{"id":"f478b06c.74a55","type":"template","z":"4d5f940a.1aa50c","name":"page","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <head>\n <title>Quake List</title>\n </head>\n <body>\n <h1>Quake List</h1>\n \n <ul>\n {{#payload.mag}}\n <li>Magnitude: {{.}}</li>\n {{/payload.mag}}\n {{#payload.place}}\n <li>Location: {{.}}</li>\n {{/payload.place}}\n </ul>\n \n \n \n </body>\n</html>","x":870,"y":840,"wires":[["fadae521.151198"]]},{"id":"fadae521.151198","type":"http response","z":"4d5f940a.1aa50c","name":"","statusCode":"","headers":{},"x":1050,"y":840,"wires":[]},{"id":"6976e284.44b4ac","type":"function","z":"4d5f940a.1aa50c","name":"Set Global Quake Data","func":"global.set(\"GlobalVariable\",msg.payload);\nreturn msg;","outputs":1,"noerr":0,"x":510,"y":700,"wires":[["15ef9947.601807"]]},{"id":"d3fbe980.526bc8","type":"function","z":"4d5f940a.1aa50c","name":"Get Global Quakes","func":"var ObtainedData = global.get(\"GlobalVariable\");\nmsg.payload = ObtainedData;\nreturn msg;","outputs":1,"noerr":0,"x":430,"y":860,"wires":[["d2810909.38aa28"]]},{"id":"aa53253c.fa5878","type":"debug","z":"4d5f940a.1aa50c","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","x":890,"y":900,"wires":[]},{"id":"d2810909.38aa28","type":"split","z":"4d5f940a.1aa50c","name":"","splt":"\\n","spltType":"str","arraySplt":1,"arraySpltType":"len","stream":false,"addname":"","x":630,"y":860,"wires":[["f478b06c.74a55","aa53253c.fa5878"]]}]


#2

close... rather than split the data you need to iterate it inside the template

[{"id":"7a369b73.eab9e4","type":"http in","z":"82738787.0e0338","name":"","url":"/quakes","method":"get","upload":false,"swaggerDoc":"","x":120,"y":900,"wires":[["d9d77826.9f7b28"]]},{"id":"d9d77826.9f7b28","type":"function","z":"82738787.0e0338","name":"Get Global Quakes","func":"var ObtainedData = global.get(\"GlobalVariable\");\nmsg.payload = ObtainedData;\nreturn msg;","outputs":1,"noerr":0,"x":370,"y":900,"wires":[["a84ae00e.64a06","c51b911e.40aa8"]]},{"id":"a84ae00e.64a06","type":"debug","z":"82738787.0e0338","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","x":670,"y":920,"wires":[]},{"id":"c51b911e.40aa8","type":"template","z":"82738787.0e0338","name":"page","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <head>\n <title>Quake List</title>\n </head>\n <body>\n <h1>Quake List</h1>\n \n <ul>\n {{#payload}}\n <li>Magnitude: {{mag}}</li>\n <li>Location: {{place}}</li>\n {{/payload}}\n </ul>\n \n </body>\n</html>","x":650,"y":860,"wires":[["bc700e06.fe478"]]},{"id":"bc700e06.fe478","type":"http response","z":"82738787.0e0338","name":"","statusCode":"","headers":{},"x":810,"y":860,"wires":[]}]

#3

Thanks for your help. Works exactly as I had hoped now. Thank you!