使用 spring、thymeleaf 和 mongo 填充 html 选择

Posted 2023-02-26

【中文标题】使用 spring、thymeleaf 和 mongo 填充 html 选择

【英文标题】：Populate an html select with spring, thymeleaf, and mongo

【发布时间】：2017-03-24 21:12:04

【问题描述】：

我正在尝试使用 Spring 和 Thymeleaf 使用 Mongo 集合中的数据填充 html 选择。我已经尝试遵循这些问题的建议："how do I populate a drop down with a list using thymeleaf and spring"、"how to bind an object list with thymeleaf" 和"spring app not finding property on object"，但我没有任何运气。

当我在我的 HTML 中使用这种语法时，

<div class="form-group">
        <label for="commoditiesSelect"> Commodities: </label>
        <select multiple="Commodities" id="commoditiesSelect" class="form-control" th:field="*commodities">
           <option th:each="commodity : $possibleCommoditiesList"
                   th:text="$possibleCommodities"
                   th:value="$possibleCommodities"
           />
        </select>
    </div>

我只是在网页上得到一个空白列表供我选择。但是，我知道我发送给我的模型的列表有多个对象，其中包含信息（通过调试）。我弄乱了语法，但我得到的最接近的是指向网页上显示的对象的指针。有谁知道我哪里出错了？下面包括我的控制器、服务实现、PossibleCommodities 类和PossibleCommoditiesRepository 类。

控制器：

@GetMapping("/welcomeMatForm")
public String welcomeMatForm(Model model) 
    List<PossibleCommodities> possibleCommoditiesList = welcomeMatService.getPossibleCommodities();
    model.addAttribute("possibleCommoditiesList", possibleCommoditiesList);
    model.addAttribute("welcomeMatForm", new WelcomeMatForm());
    return "welcomeMatForm";

服务实现类：

    public List<PossibleCommodities> getPossibleCommodities()
    List<PossibleCommodities> listOfCommodities = possibleCommoditiesRepository.findAll();
    return listOfCommodities;

PossibleCommodities 类：

package com.sensus.analytics.welcomemat.core.model;

import org.springframework.data.annotation.TypeAlias;
import org.springframework.data.mongodb.core.mapping.Document;

@Document(collection = "possible_commodities")
@TypeAlias("PossibleCommodities")
public class PossibleCommodities extends BasicMongoDocument

public String commodityName;
private int commodityId;

public String getCommodityName(int commodityId) 
    return commodityName;


public void setCommodityName(String commodityName) 
    this.commodityName = commodityName;


public int getCommodityId(String commodityName)
    return commodityId;


public void setCommodityId(int commodityId) 
    this.commodityId = commodityId;

PossibleCommoditiesRepository 类：

package com.sensus.analytics.welcomemat.core.repository;

import com.sensus.analytics.welcomemat.core.model.PossibleCommodities;
import org.springframework.data.mongodb.repository.MongoRepository;
import java.util.List;

public interface PossibleCommoditiesRepository extends MongoRepository<PossibleCommodities, String>  
public List<PossibleCommodities> findAll();

编辑：我也尝试过这种 HTML 通用语法：

<div class="form-group">
        <label for="commoditiesSelect"> Commodities: </label>
        <select multiple="Commodities" id="commoditiesSelect" class="form-control" th:field="*commodities">
           <option th:each="commodity : $possibleCommoditiesList"
                   th:text="$possibleCommodities.commodityName"
                   th:value="$possibleCommodities.commodityName"
           />

        </select>
    </div>

但它给了我这个错误：EL1007E:(pos 0): Property or field 'commodityName' cannot be found on null

【参考方案1】：

在这样的一行中，您必须知道变量的定义位置：

<option th:each="commodity : $possibleCommoditiesList" th:text="$possibleCommodities" th:value="$possibleCommodities" />

这里有 3 个变量

commodity -- 由 th:each 表达式定义 possibleCommoditiesList - 通过将其添加到模型（在您的控制器中）来定义 possibleCommodities -

没有在任何地方定义。这会解析为 null，因此您会得到一个空白选项列表。

在您的第二个示例中，错误是由 thymleaf 尝试在 null 对象上调用 getCommodityName() 引起的。李>

由于在您的 th:each 中，您将变量指定为商品，您可能需要执行以下操作：

<option th:each="commodity : $possibleCommoditiesList" th:text="$commodity.commodityName" th:value="$commodity.commodityName" />