Output json data to html template

Can someone please help me get the output for Template, same output as debug shows right after http request node. found few similar posts here, but still can't get this work :slight_smile:

[
    {
        "id": "ec5233ca1116fa70",
        "type": "http request",
        "z": "f3698a3f6c8d8f2d",
        "name": "",
        "method": "GET",
        "ret": "obj",
        "paytoqs": "body",
        "url": "https://,
        "tls": "",
        "persist": false,
        "proxy": "",
        "authType": "",
        "senderr": false,
        "credentials": {},
        "x": 370,
        "y": 120,
        "wires": [
            [
                "5716c988bbe9a686",
                "2df1dbe73f69ab1d"
            ]
        ]
    },
    {
        "id": "5716c988bbe9a686",
        "type": "template",
        "z": "f3698a3f6c8d8f2d",
        "name": "",
        "field": "payload",
        "fieldType": "msg",
        "format": "handlebars",
        "syntax": "mustache",
        "template": "<!DOCTYPE html>\n<html>\n    <head>\n    </head>\n    <body>\n\n            <h1>Hello </h1>\n            {{payload.results[0].name}}\n    </body>\n</html>",
        "output": "str",
        "x": 640,
        "y": 120,
        "wires": [
            [
                "f3e40b161b689c1a"
            ]
        ]
    },
    {
        "id": "f3e40b161b689c1a",
        "type": "debug",
        "z": "f3698a3f6c8d8f2d",
        "name": "",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "payload.results[0].name",
        "targetType": "msg",
        "statusVal": "",
        "statusType": "auto",
        "x": 900,
        "y": 120,
        "wires": []
    },
    {
        "id": "874b0adc0efdef79",
        "type": "inject",
        "z": "f3698a3f6c8d8f2d",
        "name": "",
        "props": [
            {
                "p": "payload"
            },
            {
                "p": "headers",
                "v": "{\"content-type\": \"application/json\"}",
                "vt": "json"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "",
        "payloadType": "date",
        "x": 180,
        "y": 120,
        "wires": [
            [
                "ec5233ca1116fa70"
            ]
        ]
    },
    {
        "id": "2df1dbe73f69ab1d",
        "type": "debug",
        "z": "f3698a3f6c8d8f2d",
        "name": "",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "payload.results[0].name",
        "targetType": "msg",
        "statusVal": "",
        "statusType": "auto",
        "x": 660,
        "y": 220,
        "wires": []
    }
]

Must be something with the mustache syntax accessing the deep nested values
This link may give you some hints

Personally i wouldnt dedicate any brain power to learn mustache ..
just use a Change node to pick the value you want and set it as payload

image

and in the Template use

 <body>
        <h1>Hello </h1>
        {{payload}}
 </body>

ps. is this for use in the Nodered Dashboard ?
you could instead use a ui_template directly that uses AngularJS instead

Mustache template does not use square bracket notation for arrays.
Try
{{payload.results.0.name}}
Or to loop through nested results and names arrays.

{{#payload.results}}
       {{#names}}
             {{name}}
        {{/names}}
{{/payload.results}}
1 Like

I will look for these tips thank you! and I guess I need some sort of loop for this since property is nested.