Template node payload

Dashboard
1

Hi,
i'm trying to pass a "msg.payload" to a "ui_template" node: I read a lot of stuff on web on how can I do this, but nothing works.
My "msg.payload" is something like this:

msg.payload = {"tag1" : lastZone1, "tag2" : lastZone2, "tag3" : lastZone3, "tag4" : lastZone4, "tag5" : lastZone5};

and my ui_template has this code:

<div ng-bind-html="msg.payload"></div>
<iframe id="myFrame" width="640" height="480" src = ""></iframe>
<script>
(function(scope) {
    // watch msg object from Node-RED
    scope.$watch('msg', function(msg) {
        // new message received
        console.log("+++++++++++"+msg.payload);
        });
})(scope);
</script>
<!--<img src="/map_costabassa.JPG" id="map" class="md-card-image">-->
<div layout="row" >
    <h1 id="test1">{{msg.payload}}</h1>
</div>

but nothing is shown on the page. Here the json of my flow:

[{"id":"c8171e52.9117b","type":"tab","label":"Mappa","disabled":false,"info":""},{"id":"faa51c6b.c2c8f","type":"mui_template","z":"c8171e52.9117b","group":"a0f908ae.1b1d58","name":"","order":0,"width":"21","height":"11","format":"<div ng-bind-html=\"msg.payload\"></div>\n<iframe id=\"myFrame\" width=\"640\" height=\"480\" src = \"\"></iframe>\n<script>\n(function(scope) {\n    // watch msg object from Node-RED\n    scope.$watch('msg', function(msg) {\n        // new message received\n        console.log(\"+++++++++++\"+msg.payload);\n        });\n})(scope);\n</script>\n<!--<img src=\"/map_costabassa.JPG\" id=\"map\" class=\"md-card-image\">-->\n<div layout=\"row\" >\n    <h1 id=\"test1\">{{msg.payload}}</h1>\n</div>","storeOutMessages":true,"fwdInMessages":false,"templateScope":"local","x":804.1000595092773,"y":48.80000400543213,"wires":[[]]},{"id":"75405113.2473b","type":"mongodb2 in","z":"c8171e52.9117b","service":"_ext_","configNode":"bd3d666a.0cba18","name":"","collection":"collection","operation":"find.toArray","x":478.1000061035156,"y":71,"wires":[["16fac03f.1f791"]]},{"id":"9f8c9fb6.d7ed","type":"debug","z":"c8171e52.9117b","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","x":784.1000595092773,"y":147.00000286102295,"wires":[]},{"id":"16442e85.273071","type":"inject","z":"c8171e52.9117b","name":"","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":123.10000610351562,"y":157.00000381469727,"wires":[["3e8054a6.b7ba4c"]]},{"id":"3e8054a6.b7ba4c","type":"function","z":"c8171e52.9117b","name":"","func":"msg = {\n'collection' : 'collection',\n'operation': 'find.toArray',\n'payload': {\n    \n        }\n};\nreturn msg;\n","outputs":1,"noerr":0,"x":253.100004196167,"y":88.00000381469727,"wires":[["75405113.2473b"]]},{"id":"16fac03f.1f791","type":"function","z":"c8171e52.9117b","name":"","func":"var lastZone1,lastZone2,lastZone3,lastZone4,lastZone5;\n//prendo ultima zona di ogni tag\nfor(var i=0; i<msg.payload.length;i++){\n    \n    switch(msg.payload[i][\"id\"]){\n        \n        case 32821: lastZone1 = msg.payload[i][\"zone\"].slice(-1).pop();\n                    break;\n        case 32822: lastZone2 = msg.payload[i][\"zone\"].slice(-1).pop();\n                    break;\n        case 32823: lastZone3 = msg.payload[i][\"zone\"].slice(-1).pop();\n                    break;\n        case 32824: lastZone4 = msg.payload[i][\"zone\"].slice(-1).pop();\n                    break;\n        case 32825: lastZone5 = msg.payload[i][\"zone\"].slice(-1).pop();\n                    break;\n    }    \n    console.log(\"++++\"+msg.payload[i][\"zone\"].slice(-1).pop());\n    \n}\nmsg.payload = {\"tag1\" : lastZone1, \"tag2\" : lastZone2, \"tag3\" : lastZone3, \"tag4\" : lastZone4, \"tag5\" : lastZone5};\nreturn msg;","outputs":1,"noerr":0,"x":613.1000595092773,"y":181.0000023841858,"wires":[["faa51c6b.c2c8f","9f8c9fb6.d7ed"]]},{"id":"336fcca4.fc6314","type":"mui_ui_control","z":"c8171e52.9117b","name":"","x":348.1000061035156,"y":181.8000030517578,"wires":[["3e8054a6.b7ba4c"]]},{"id":"a0f908ae.1b1d58","type":"mui_group","z":"","name":" map","tab":"b217a802.6b21b8","order":2,"disp":false,"width":"21","collapse":false},{"id":"bd3d666a.0cba18","type":"mongodb2","z":"","uri":"xxxxx","name":"xxxxxx","options":"","parallelism":"-1"},{"id":"b217a802.6b21b8","type":"mui_tab","z":"","name":"Mappa","icon":"dashboard","order":2}]

Any idea? I tried any syntax for the payload...
Thank you

2

Have you taken a look in the FLOWS section of the site for an example? There are currently 36 example flows there. Use a keyword of template and unclick the 'nodes' box

3

Believe me, I tried many solution starting from example.... but nothing change...

4

The problem could be that I'm using mdashboard and not dashboard?
mdashboard comes from "node-red-contrib-mdashboard" package...

5

The recommendation is to only use one

1 Like