EEx interpolation inside a tag in heex templates

Phoenix Forum Questions / Help
1

From Programming Phoenix 1.4:

This code is valid in .eex templates but fails in .heex templates.

<img src="<%= Routes.static_url(@conn, "/images/phoenix.png") %>"/>

What is the alternative syntax for the EEx interpolation inside a tag in heex templates? How will the above code be written in heex templates?

2

<img src={Routes.static_url(@conn, "/images/phoenix.png")} />

More information in docs: Views and templates — Phoenix v1.6.0

3 Likes
3

Thank you @Nicd !

4

I have a related question, how would you add a condition which adds a checked value within the input tag?

<input type="radio" class="btn-check" name="options" phx-value-state="off" id="option1" {if !@state.active, do: "checked"}>

The example above results in an error protocol Enumerable not implemented for nil of type Atom

5

You can directly use checked={!@state.active}, the attribute will be added/removed as needed by LiveView.

3 Likes