How to display an object that contains another object in thymeleaf - spring

Question

Hi I struggling to build a proper view in case, when I want to display the product entity, which is in a many-to-many relation with the category. The problem starts with the nested category. I have an error: Exception evaluating SpringEL expression: "category.name" (productList: 31) I will be very grateful for your help in solving this problem
View:
<tbody>
<tr data-th-each="product : ${products}">
<!--<td><input hidden="hidden" name="id" th:value="${product.id}" /></td>-->
<td th:text="${product.name}"></td>
<td th:text="${product.price}"></td>
<td th:each="category : ${product.categories}"></td>
<td th:text="${category.name}"></td>
<td th:text="${product.description}"></td>
<td th:text="${product.shippingWeight}"></td>
<td th:text="${product.quantity}"></td>
<td>delete</td>
</tr>
</tbody>
Entities:
#NoArgsConstructor
#AllArgsConstructor
#Getter
#Setter
#Entity
#Table(name = "products")
public class Product {
#Id
#GeneratedValue(strategy = GenerationType.AUTO)
#Column(name = "product_id")
private Long id;
private String name;
private BigDecimal price;
#ManyToMany(cascade = CascadeType.ALL,mappedBy = "products")
private List<Category> categories=new ArrayList<>();
private double shippingWeight;
private boolean isAvailable;
private String description;
private int quantity;
#Transient
private MultipartFile image;
Category:
#AllArgsConstructor
#NoArgsConstructor
#Getter
#Setter
#Entity
#Table(name = "categories")
public class Category {
#Id
#GeneratedValue(strategy = GenerationType.AUTO)
#Column(name = "category_id")
private Long id;
private String name;
private String description;
#ManyToMany(cascade = CascadeType.ALL)
#JoinTable(name = "join_category_product", joinColumns = {#JoinColumn(name = "category_id", referencedColumnName = "category_id")},
inverseJoinColumns = {#JoinColumn(name = "product_id", referencedColumnName = "product_id")})
private List<Product> products=new ArrayList<>();
#Transient
private MultipartFile image;
Controller:
#GetMapping("/productList")
public String productList(Model model) {
List<Product> product = productService.getProducts();
model.addAttribute("products",product);
return "productList";

Answer 1

You need to make sure that the Thymeleaf can understand the scope of your variables. In your post, you have category.name outside of the for loop. If categories is a property of product, you can do something like:
<tr th:each="product : ${products}">
<td th:text="${product.name}"></td>
<td th:text="${product.price}"></td>
<td>
<th:block th:each="category : ${product.categories}">
<th:block th:text="${category.name}">[category name]</th:block>
<br>
</th:block>
</td>
<td th:text="${product.description}"></td>
<td th:text="${product.shippingWeight}"></td>
<td th:text="${product.quantity}"></td>
<td>delete</td>
</tr>
If a product doesn't have a category, note that the above will still create a <td>. This is likely what you want.
Aside: it would also make sense to supply default values between your tags. This way, you can open up the file directly in a browser (without a container) and still see how it would lay out. This is a huge reason to use Thymeleaf. I included this with [category name] example above.
Otherwise, you can do the shorter version:
<td>[[${product.name}]]</td>