How to use html lists in Nitrogen

Question

I would like to create an html list in Nitrogen but can't figure out how to do it. Basically I want to output:

<ul>
  <li>One</li>
  <li>Two</li>
</ul>

I found some source for lists under apps/nitrogen/src/elements/html in my Nitrogen distribution so it seems like there is an element that can do this but none of my attempts to use the element compile. Can someone please provide a snippet which will produce the above html?

Answer 1

Just use your erlang string and list manips like this:

body()->
 Items = ["Joe Armstrong","Robert Virding","Mike Williams"],
 UL = "<ul>" ++ lists:flatten(["<li>" ++ X ++ "</li>" || X <- Items]) ++"</ul>",
 [
    #panel{body=[
                UL,
                #br{},
                #button {text="Continue", postback=continue}
    ]}
 ].

You have a list of items, the list can be from a database or anything. The list items should be strings for tis to work well, if a different type then you need to convert first. Then a list comprehension and latter you flatten the whole list to be one thing. Hope it helps !

Answer 2

Here's a version that uses the #list and #listitem nitrogen elements rather than raw HTML.

body() ->
  List = ["Apple","Orange","Banana"],
  #list{
     body=[#listitem{body=Fruit} || Fruit <- ListOfFruit]
   }.

For any expressions more complicated than that, I'll usually switch from a list comprehension to lists:map/2