Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Java Spring Basics Modeling, Storing, and Presenting Data Create an Index Page with Thymeleaf

Timothy Boland
Timothy Boland
18,237 Points
Posted by Timothy Boland
Timothy Boland
18,237 Points

Using th:each on an unordered list of list items : ive tried this a variety of ways but I cant get it to work...

every example of th:each ive seen used, was initiated on a div, which the sample code in this question does not contain....does anyone know the way to implement this while appeasing the code sample in the question

src/main/resources/templates/contact_list.html 
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta charset="UTF-8"/>
    <meta description="viewport" content="width=device-width, initial-scale=1"/>

    <link rel="stylesheet" th:href="@{/app.css}"/>

    <title>Contact List</title>
  </head>
  <body>
    <h1>Contacts</h1>
    <ul>
      <li th:each="contact : ${contacts}">
        th:text=${contact.firstName} 
      </li>
    </ul>
  </body>
</html>

1 Answer

Alexander Nikiforov
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Alexander Nikiforov
Java Web Development Techdegree Graduate 22,175 Points
Alexander Nikiforov
.a{fill-rule:evenodd;}techdegree seal-36
Alexander Nikiforov
Java Web Development Techdegree Graduate 22,175 Points

I thought it is better policy to write "th:each" in parent <ul> element.

But apparently Chris has a different opinion for that

This below should work:

    <ul> <!-- REPLACE THE LI ELEMENTS BELOW -->
      <li th:each="contact:${contacts}" th:text="${contact.firstName}"></li>
    </ul>

For the previous video, there is the same question that you asked. Check it out. Here is the link.

Timothy Boland
Timothy Boland
18,237 Points
Timothy Boland
Timothy Boland
18,237 Points

Yes...the old style is another variation i tried...but it returns the following error:

Bummer! You are missing a th:each attribute in your <li>. This is required for Thymeleaf to generate multiple elements based on a collection.