# How template node get data from inject node

**URL:** <https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130>\
**Category:** General\
**Created:** [28 July 2023 08:11 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130 "2023-07-28T08:11:07Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![HenryTrang](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/henrytrang/32/81582_2.png) [@HenryTrang](https://discourse.nodered.org/u/HenryTrang)\
**Post date:** [28 July 2023 08:11 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130/1 "2023-07-28T08:11:07Z")

</div>

Dear veteran

I create a web page in **template node**. and try to show inject number on the page.but inject data didn't show. any veteran tell me how to display the number data injected from **inject node**

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/2/c/2c282e96c19e97946269914d98b4bd73ffeccec9.png)

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/b/1/b1e8548bba1d01bfe3d65fcb9ae99db97e94f12c.png)

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [28 July 2023 09:38 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130/2 "2023-07-28T09:38:00Z")

</div>

1. what version of Node-RED and node.js are you running? (You can find this in the NR startup log)
2. please export your flow and paste it to a response.

In order to make code readable and usable it is necessary to surround your code with three backticks (also known as a left quote or backquote `````)

````auto
``` 
   code goes here 
```

````

You can edit and correct your post by clicking the pencil ✏ icon.

See this post for more details - [How to share code or flow json](https://discourse.nodered.org/t/how-to-share-code-or-flow-json/506)

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [28 July 2023 09:44 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130/3 "2023-07-28T09:44:05Z")

</div>

There is most basic example to create such stuff using websocket

[https://flows.nodered.org/flow/8666510f94ad422e4765](https://flows.nodered.org/flow/8666510f94ad422e4765)

---

<div class="post-metadata">

**Author:** ![HenryTrang](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/henrytrang/32/81582_2.png) [@HenryTrang](https://discourse.nodered.org/u/HenryTrang)\
**Post date:** [28 July 2023 09:46 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130/5 "2023-07-28T09:46:05Z")

</div>

thank you sir. i am going to see it now.

---

<div class="post-metadata">

**Author:** ![HenryTrang](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/henrytrang/32/81582_2.png) [@HenryTrang](https://discourse.nodered.org/u/HenryTrang)\
**Post date:** [28 July 2023 09:50 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130/6 "2023-07-28T09:50:18Z")

</div>

Dear Sir

please check this flow

```auto
[
    {
        "id": "7d1b1ecbd34a6d6c",
        "type": "http in",
        "z": "f29ea641f58d9394",
        "name": "meg",
        "url": "/meg",
        "method": "get",
        "upload": false,
        "swaggerDoc": "",
        "x": 210,
        "y": 440,
        "wires": [
            [
                "e6826b7a8488f86f"
            ]
        ]
    },
    {
        "id": "19f4f74d78734578",
        "type": "http response",
        "z": "f29ea641f58d9394",
        "name": "",
        "statusCode": "",
        "headers": {},
        "x": 850,
        "y": 520,
        "wires": []
    },
    {
        "id": "6fc8263a8b8b8009",
        "type": "template",
        "z": "f29ea641f58d9394",
        "name": "template",
        "field": "payload",
        "fieldType": "msg",
        "format": "html",
        "syntax": "mustache",
        "template": "<!DOCTYPE html>\n<html lang=\"en\">\n\n<head>\n <meta charset=\"UTF-8\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n <title>Vite + Vue + TS</title>\n</head>\n\n<body>\n <div id=\"app\">\n 小兔子乖乖{{payload.a}}\n </div>\n</body>\n\n</html>",
        "output": "str",
        "x": 640,
        "y": 520,
        "wires": [
            [
                "19f4f74d78734578",
                "91b73d47ec3f48dc"
            ]
        ]
    },
    {
        "id": "91b73d47ec3f48dc",
        "type": "debug",
        "z": "f29ea641f58d9394",
        "name": "debug 3",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "payload",
        "targetType": "msg",
        "statusVal": "",
        "statusType": "auto",
        "x": 860,
        "y": 580,
        "wires": []
    },
    {
        "id": "e6826b7a8488f86f",
        "type": "function",
        "z": "f29ea641f58d9394",
        "name": "function 4",
        "func": "msg.payload = {a:'abcd efg'}\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 440,
        "y": 520,
        "wires": [
            [
                "6fc8263a8b8b8009"
            ]
        ]
    },
    {
        "id": "b492170ec0b5633b",
        "type": "inject",
        "z": "f29ea641f58d9394",
        "name": "",
        "props": [
            {
                "p": "payload"
            },
            {
                "p": "topic",
                "vt": "str"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "",
        "payloadType": "date",
        "x": 190,
        "y": 660,
        "wires": [
            [
                "7b99497c7bc2fb9e"
            ]
        ]
    },
    {
        "id": "7b99497c7bc2fb9e",
        "type": "function",
        "z": "f29ea641f58d9394",
        "name": "function 5",
        "func": "msg.payload = { a: '----' }\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 360,
        "y": 640,
        "wires": [
            [
                "6fc8263a8b8b8009"
            ]
        ]
    }
]

```

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [28 July 2023 10:24 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130/7 "2023-07-28T10:24:23Z")

</div>

Your problem is that every time you refresh the page, the flow starts from the `http-in` node and then goes to the 'function 4' node and that sets msg.payload to a value and sends it to the `template` then to the `http response` node.

Take a look at his [Include data captured in another flow : Node-RED](https://cookbook.nodered.org/http/include-data-from-another-flow) and see if it helps.

---

<div class="post-metadata">

**Author:** ![HenryTrang](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/henrytrang/32/81582_2.png) [@HenryTrang](https://discourse.nodered.org/u/HenryTrang)\
**Post date:** [31 July 2023 01:02 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130/8 "2023-07-31T01:02:19Z")

</div>

thanks a lot sir. you are very kind and excellent at work.

---

<div class="post-metadata">

**Author:** ![HenryTrang](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/henrytrang/32/81582_2.png) [@HenryTrang](https://discourse.nodered.org/u/HenryTrang)\
**Post date:** [31 July 2023 07:29 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130/9 "2023-07-31T07:29:06Z")

</div>

it work. but why update html via document.getElementById(id).html = abc? why vue not working?

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [31 July 2023 08:01 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130/10 "2023-07-31T08:01:02Z")

</div>

If you want vue to work, then you will need to serve all of the necessary files via 1 or more endpoints. If you dont know which files or where to start looking then you may need to learn more about serving web pages and how to use your browsers devtools to understand what is happening.

In the meantime, you may be better suited to using [uibuilder](https://flows.nodered.org/search?term=uibuilder) - it will do the majority of heavy lifting so you can begin building a vue app.

---

<div class="post-metadata">

**Author:** ![HenryTrang](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/henrytrang/32/81582_2.png) [@HenryTrang](https://discourse.nodered.org/u/HenryTrang)\
**Post date:** [31 July 2023 09:46 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130/11 "2023-07-31T09:46:52Z")

</div>

thank you sir for your direct

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [14 August 2023 09:47 UTC](https://discourse.nodered.org/t/how-template-node-get-data-from-inject-node/80130/12 "2023-08-14T09:47:25Z")

</div>

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