Question

使用Thymeleaf我想通过关闭先前的<ul>并在每次＆＃34;或者＆＃34;子菜单＆＃34;值与上一次迭代相关的变化。例如，我想转换以下查询结果...

----------------------------------
| Menu      | SubMenu  | Title   |
|--------------------------------|
| MenuName1 | SubMenu1 | Title1  |
| MenuName1 | SubMenu1 | Title2  |
| MenuName1 | SubMenu2 | Title3  |
| MenuName2 | SubMenu3 | Title4  |
| MenuName3 | SubMenu4 | Title5  |
----------------------------------

...进入无序列表（对于菜单）：

<ul>
  <li>MenuName1
    <ul>
      <li>SubMenu1
        <ul>
          <li>Title1</li>
          <li>Title2</li>
        </ul>
      </li>
      <li>SubMenu2
        <ul>
          <li>Title3</li>
        </ul>
      </li>
    </ul>
  </li>
  <li>MenuName2
    <ul>
      <li>SubMenu3
        <ul>
          <li>Title4</li>
        </ul>
      </li>
    </ul>
  </li>
  <li>MenuName3
    <ul>
      <li>SubMenu4
        <ul>
          <li>Title5</li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

我可以访问服务器和客户端代码，因此很高兴为模板提供更多Thymeleaf友好格式，如果这是一个更优雅的解决方案。

Answer 1

您必须在服务器端将数据转换为正确的格式。

在您的示例中，您将为Menu和Submenu创建类：

您的主类有一个LinkedHashMap<String, Menu>，可将菜单标题映射到菜单
Menu有一个LinkedHashMap<String, Submenu>，可将子菜单标题映射到子菜单
Submenu包含Article个列表

然后，您的Java代码遍历Article的列表，并基于Menu和Submenu属性动态创建menu和submenu实例Article，然后将Article添加到正确的Submenu。在主类中使用辅助方法Menu getOrCreateMenu(String title)在Submenu getOrCreateSubmenu(String title)类中使用辅助方法Menu可能有益于处理具有给定标题的新（子）菜单的逻辑尚不存在，或者如果存在则返回现有的（请查看Map.computeIfAbsent，它可以非常简洁地做到这一点）。

然后将整个菜单列表放入模型中，并将其发送给Thymeleaf；渲染应该是无关紧要的：

<ul>
  <li th:each="menu : ${menus}" th:text="${menu.title}>
    <ul>
      <li th:teach="submenu : ${menu.submenus}" th:text=${submenu.title}>
        <ul>
          <li th:each="article : ${submenu.articles}" th:text="${article.title}" />
        </ul>
      </li>
    </ul>
  </li>
</ul>

将值与Thymeleaf上一次迭代中的值进行比较

1 个答案: