UI template image via msg.payload

Set up a UI TEMPLATE NODE.
Want to display an image
Method 1:
<img ng-src=''http://192.168.3.11/picture/snapshot.jpg" height="470" width="280" />

This works fine.

Method 2:
using a function to set the
msg.payload = 'http://192.168.3.11/picture/snapshot.jpg";
return msg;

Then in the UI Template passed in the msg.payload.

But the image does not show.

Any ideas?

this works!

Do you mean you have solved your problem?

it worked.

The goal is to display a picture from a http as a payload and display on the Dashboard with a UI Template :
i try this :

This is mine :

msg.payload = 'https://pngimage.net/wp-content/uploads/2018/06/power-on-png-6.png';
return msg;

Then i paste : <img src= "msg.payload" /> in the UI Template like this : image

but nothing display : image

i missed something ?! @sweetwater

i found the solution : in the UI Template paste this : :smiley:

<p> Status:
<img width="30" height="30" src=  {{msg.payload}} alt='Image not found'  />
</p>

image

And go further :

add in the function node : msg.title = 'Working good !' ;
and in the UI Template : title={{msg.title}}

title
display a message when the mouse is over

how to show the local imageļ¼Ÿ
I use msg.payload = 'file:///home/ubuntu/1.png';
but failed