Equivalent of a "for" loop in a template

2,225 views
Skip to first unread message

pj.beta...@gmail.com

unread,
Feb 3, 2016, 7:45:21 AM2/3/16
to phoenix-talk
I'm trying too dynamically create some HTML elements inside a Phoenix template.
I would like to do something like (Javascript):

for (i = 0; i < <%= @sliclGal_iter %>; i++) { 
         <img class="slickGal" src="<%= @slickGal_imgPath[i] %>">
}

I know Elixir uses recursion so I tried without success. I created a Stackoverflow question with this: http://stackoverflow.com/questions/35158271/how-to-use-the-equivalent-of-a-for-loop-in-a-template
Is this feasible or should I try another approach?
Thanks!

PJ

Steve Domin

unread,
Feb 3, 2016, 8:38:37 AM2/3/16
to phoenix-talk, pj.beta...@gmail.com
If you are trying to iterate through a list you can use a comprehension (http://elixir-lang.org/getting-started/comprehensions.html)

Example:

# web/templates/images/index.html.eex

<%= for image <- @images do %>
 
<img class="slickGal" src="<%= image.path %>">
<% end %>

pj.beta...@gmail.com

unread,
Feb 3, 2016, 9:53:31 AM2/3/16
to phoenix-talk, pj.beta...@gmail.com
Thank you Steve but I'm not (unless that's the only way of doing this with Elixir/Phoenix).

Steve Domin

unread,
Feb 3, 2016, 10:15:03 AM2/3/16
to phoeni...@googlegroups.com, pj.beta...@gmail.com
I'm not sure what you are trying to achieve then. Can you give an Elixir snippet that's as close as possible to what you are trying to do?

--
You received this message because you are subscribed to the Google Groups "phoenix-talk" group.
To unsubscribe from this group and stop receiving emails from it, send an email to phoenix-talk...@googlegroups.com.
To post to this group, send email to phoeni...@googlegroups.com.
Visit this group at https://groups.google.com/group/phoenix-talk.
To view this discussion on the web visit https://groups.google.com/d/msgid/phoenix-talk/87565016-4414-43cf-a5db-5ba8bce5931d%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

Gilbert Kennen

unread,
Feb 3, 2016, 10:30:15 AM2/3/16
to phoeni...@googlegroups.com
On 02/03/2016 04:45 AM, pj.beta...@gmail.com wrote:
> for (i = 0; i < <%= @sliclGal_iter %>; i++) {
> <img class="slickGal" src="<%= @slickGal_imgPath[i] %>">
> }

> On 02/03/2016 06:53 AM, pj.beta...@gmail.com wrote:
> Thank you Steve but I'm not (unless that's the only way of doing this
> with Elixir/Phoenix).

The only way? Certainly not, but it is the most idiomatic way. The code
in your example shows that you are trying to force a square peg into a
round hole here.

In your example, you are using @slicGal_imgPath with numerical indices,
so you have something you can iterate on here. You should normally be
transforming this collection into something you can iterate on and
remove logic from the template.

While there are likely easier ways to do this depending on what the
underlying structure of @sliclGal_iter (looks like a typo there?) is,
knowing absolutely nothing, here is a general solution. You can put this
function in the view.

defp image_paths(path_collection, element_count) do
for n <- 0..(element_count - 1), do: path_collection[n]
end

then you can add the following in your template:

<%= for path <- image_paths(@slickGal_imgPath, @sliclGal_iter) do %>
<%= tag(:a, class: "slickGal", src: path %>
<% end %>

There are certainly optimizations to be made here depending on all sorts
of details from your use case.

Gilbert

pj.beta...@gmail.com

unread,
Feb 3, 2016, 11:15:34 AM2/3/16
to phoenix-talk, gil...@firewatcher.org
Ok, now I see it and makes sense. Thank you!
Reply all
Reply to author
Forward
0 new messages