如何用 Phoenix 渲染 img？

Question

I'm new in phoenix. I need to display all the posts and pictures to them on the main page. I written below code in my index template:

<img src="<%= Blog.Image.url({@post.image, @post}, signed: true) %>">

And i got this

lib/blog_web/templates/post/index.html.heex:19:21: expected closing " for attribute value

What i missing?

Answer 1

The HEEx documentation notes:

...code interpolation using <%= ... %> and <% ... %> are restricted to the body (inner content) of the HTML/component nodes and it cannot be applied within tags.

Instead, there is specific HEEx syntax attribute={expression} for interpolating attribute values. In your example, you'd use

<img src={Blog.Image.url({@post.image, @post}, signed: true)}> 

The engine will correctly insert quotation marks and other escaping as required (or, if Blog.Image.url/2 returns nil , omit the attribute entirely).