Dynamic image sources in heex templates

Phoenix Forum Questions / Help
,
1

What is the new way to dynamically render image src paths using a helper method in .heex templates?

In the past you could render images like:

<img src="/images/<%= report_icon(scouting_report.report_type) %>">

Now, when using .heex templates, I don’t know how to prepend the “/images/” to the src path. I’ve tried different combinations using the brackets as well as the old ‘embedded’ elixir tags <%= %>.

<img src="/images/{report_icon(scouting_report.report_type)}">
<img src={/images/<%=report_icon(scouting_report.report_type)}>
<img src={/images/"<%= report_icon(scouting_report.report_type) %>"}>

I can’t seem to find any documentation on it…

Thanks for any help!

2

without testing: (use string interpolation)

<img src={"/images/#{report_icon(scouting_report.report_type)}"}>

2 Likes
3

Thank you very much, that solved it!

1 Like