我在node-red的模板节点内有一个javascript代码，此代码是一个简单的进度栏。运行html代码按钮的javascript函数非常容易，但是我想在payload到达时运行代码...然后在payload时发送新的width等于95 ...
[我的想法是运行此代码：msg.payload === 0 ? move() : ''当我的move()等于0时运行payload。但是我不知道在哪里写它。
然后，当witdh等于95但无法正常工作时，我尝试将值1分配给我的payload，以确保我没有使用好的语法。。节点红色。
template也许您已经知道这一点，但是让我在这里重复一遍，因为许多人不知道或忘记了它。
您的Node-RED流在服务器（后端）中作为Node.js应用程序运行。
脚本标签内的JavaScript代码在浏览器中运行。
浏览器中的代码无法在运行时中直接从ui_template读取消息或向ui_template发送消息。
（（a）从运行时向浏览器中运行的代码发送消息。
解决方案将您的函数包装在此函数周围：
<!DOCTYPE html>
<html>
<style>
#myProgress {
width: 100%;
background-color: #ddd;
}
#myBar {
width: 100%;
height: 30px;
background-color: #4CAF50;
}
</style>
<body>
<h1>JavaScript Progress Bar</h1>
<div id="myProgress">
<div id="myBar"> </div>
</div>
<p id="msg"> </p>
<button onclick="move()">Click Me</button>
<br>
<script>
var i = 0;
function move() {
if (i == 0) {
i = 1;
var elem = document.getElementById("myBar");
var message = document.getElementById("msg");
var width = 100;
var id = setInterval(frame, 100);
function frame() {
if (width <= 0) {
clearInterval(id);
i = 0;
} else {
width = width - 1;
elem.style.width = width + "%";
elem.textContent = width;
if (width == 95) {
message.textContent = "forcez";
{payload: 1};
}
}
}
}
}
</script>
</body>
（（b）将对象从在浏览器中运行的代码发送到运行时。
范围对象具有一个发送函数，可用于在运行时内从ui_template节点发送消息。
您要使用此语句：scope.send（msg），例如：scope.send（{topic：“ topic”，有效负载：“ payload”}）]
在您的特定情况下，您需要将这些行添加到ui_template中的代码中
(function(scope){
scope.$watch('msg',function(){
...
})
})(scope)
也
<script>
(function(scope) {
// $watch fires each time the node is triggered in the flow
scope.$watch('msg', function(msg) {
if (msg.payload == 0) {
move();
}
});
.............
})(scope);
</script>
您可能需要对样品流进行一些其他更改，例如一种保护措施，以防止ui_template在仍递减计数时收到新的有效负载时无法运行两次。
尝试在示例代码中实现这些更改：
if (width == 95) {
message.textContent = "forcez";
scope.send({payload:"warning: width 95"});
}
参考：
[{"id":"dba00648.b7f6d8","type":"tab","label":"Flow 12","disabled":false,"info":""},{"id":"4cc372c7.58d5ac","type":"ui_template","z":"dba00648.b7f6d8","group":"5af14c6e.d86604","name":"","order":5,"width":0,"height":0,"format":"<!DOCTYPE html>\n<html>\n<style>\n#myProgress {\n width: 100%;\n background-color: #ddd;\n}\n\n#myBar {\n width: 100%;\n height: 30px;\n background-color: #4CAF50;\n}\n</style>\n<body>\n\n\n<div id=\"myProgress\">\n <div id=\"myBar\"> </div>\n</div>\n <p id=\"msg\"> {{msg.payload}} </p>\n \n\n\n<br>\n\n\n<script>\n\n(function(scope) {\n // $watch fires each time the node is triggered in the flow\n scope.$watch('msg', function(msg) {\n if (msg.payload == 0) {\n move();\n }\n });\n\nvar i = 0;\nfunction move() {\n if (i == 0) {\n i = 1;\n var elem = document.getElementById(\"myBar\");\n var message = document.getElementById(\"msg\");\n message.textContent = \"start\";\n var width = 100;\n var id = setInterval(frame, 100);\n \n function frame() {\n if (width <= 0) {\n clearInterval(id);\n i = 0;\n } else {\n width = width - 1;\n elem.style.width = width + \"%\";\n elem.textContent = width;\n if (width == 95) {\n \tmessage.textContent = \"forcez\";\n \tscope.send({payload:\"warning: width 95\"});\n \n }\n \n }\n }\n }\n}\n\n})(scope);\n</script>\n\n</body>","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":440,"y":240,"wires":[["9779fd5e.1d736"]]},{"id":"9779fd5e.1d736","type":"debug","z":"dba00648.b7f6d8","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":610,"y":240,"wires":[]},{"id":"dde1582.3b84ca8","type":"inject","z":"dba00648.b7f6d8","name":"","topic":"","payload":"0","payloadType":"num","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":270,"y":240,"wires":[["4cc372c7.58d5ac"]]},{"id":"72ccb344.ed011c","type":"inject","z":"dba00648.b7f6d8","name":"","topic":"","payload":"1","payloadType":"num","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":270,"y":280,"wires":[["4cc372c7.58d5ac"]]},{"id":"5af14c6e.d86604","type":"ui_group","z":"","name":"Compte à rebours","tab":"7560e5e8.ee7dfc","order":3,"disp":true,"width":"6","collapse":false},{"id":"7560e5e8.ee7dfc","type":"ui_tab","z":"","name":"Préhension SELFIT","icon":"dashboard","order":4,"disabled":false,"hidden":false}]
https://flows.nodered.org/flow/2f1aaf0635f9bf23207152682323240a