How to Dynamically change the "Value Format" of ui_text?

Dashboard
1

I know I can statically add some HTML styles inside the Value Format entry and that works,
But I am having difficulty figuring out how to change the "Value format" dynamically.

Thanks...

2

What is the problem exactly ? There is not much information here.

The "Value format" by default uses {{msg.payload}} as input.

So if you inject a msg.payload with a string "my text" it will update with "my text".

Simplistic example:

[{"id":"f7212375.975f4","type":"ui_text","z":"681f8bde.8887bc","group":"ac145052.878c48","order":0,"width":0,"height":0,"name":"","label":"text","format":"{{msg.payload}}","layout":"row-spread","x":450,"y":675,"wires":[]},{"id":"ee794605.be752","type":"inject","z":"681f8bde.8887bc","name":"","topic":"","payload":"dynamic text 1","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":230,"y":675,"wires":[["f7212375.975f4","638d20a2.025ac"]]},{"id":"1417a8d3.25c157","type":"inject","z":"681f8bde.8887bc","name":"","topic":"","payload":"dynamic text 2","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":230,"y":725,"wires":[["f7212375.975f4","638d20a2.025ac"]]},{"id":"638d20a2.025ac","type":"debug","z":"681f8bde.8887bc","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":470,"y":725,"wires":[]},{"id":"ac145052.878c48","type":"ui_group","z":"","name":"Default","tab":"c80963a7.f1cc98","disp":true,"width":"6","collapse":false},{"id":"c80963a7.f1cc98","type":"ui_tab","z":"","name":"test","icon":"dashboard","disabled":false,"hidden":false}]
3

So, it's the Format part for the text. Example, dynamically change the text color, etc.

4

Here is an example:
In the Value Format Input this works:<font color =red>{{msg.payload}}</font>

However, this does not work:<font color ={{msg.color}}>{{msg.payload}}</font>
with msg.color = "red";

So, how can I alter the color dynamically?

Thanks!

5

Have you tried setting outer quotes (in the template) around {{msg.color}}?
In case you’re not too familiar with attributes in HTML tags and the importance of double quotes, take a look at this response I wrote in another topic here: Material design icons vs font awesome

6

Yes, I did both "{{msg.color}}" and also msg.color="\"red\""; Neither works, only the hard coded version seems to work.

7

I debugged the issue - the {{msg.color}} will work now. I had a faulty node that did not update correctly which never triggered the update to the ui_text widget...

Thanks...