时间戳

首页 > 解决方案 > Thymeleaf 循环并按每 n 项分组

java - Thymeleaf 循环并按每 n 项分组

问题描述

我正在使用百里香，我想迭代一个循环并按每 n 个项目分组。现在我的代码想要按每 4 个项目分组。在搜索了大多数问题之后，这是我的代码：

<div th:each="items, iter: ${myList}" th:if="${iter.count} % 4 == 0" th:class="${iter.first}? 'nice-slider-slide active first' : 'nice-slider-slide'">
    <div class="nice-slider-entry" th:each="item, iter: ${items}">
        <span th:text="${item.getName}"></span>
    </div>
</div>

结果是空白的，它什么也没打印。但我想要的结果是：

<div class="nice-slider-slide active first">
    <div class="nice-slider-entry">
        <span>Name</span>
    </div>
    <div class="nice-slider-entry">
        <span>Name</span>
    </div>
    <div class="nice-slider-entry">
        <span>Name</span>
    </div>
    <div class="nice-slider-entry">
        <span>Name</span>
    </div>
</div>
<div class="nice-slider-slide">
    <div class="nice-slider-entry">
        <span>Name</span>
    </div>
    <div class="nice-slider-entry">
        <span>Name</span>
    </div>
    <div class="nice-slider-entry">
        <span>Name</span>
    </div>
    <div class="nice-slider-entry">
        <span>Name</span>
    </div>
</div>

标签： javaspringthymeleaf

解决方案

为什么不移动分组外视图层的逻辑？Thymeleaf 对数据计算不太友好。而不是一个简单的列表有一个列表列表：

List<String> myList;

替换为：

List<List<String>> myList;

您的百​​里香代码将是这样的：

    <div th:each="subList,iter : ${myList}" th:class="${iter.first}? 'nice-slider-slide active first' : 'nice-slider-slide'">
        <div class="nice-slider-entry" th:each="index: ${subList}">
            <span th:text="${index}"></span>
        </div>
    </div>

使用纯 Thymeleaf 解决方案进行更新：

<th:block th:with="noEl = 4,totalSize = ${#lists.size(myList)} - 1">
    <th:block th:each=" listIndex: ${#numbers.sequence(0, totalSize, noEl)}">
        <div th:class="${listIndex eq 0 }? 'nice-slider-slide active first' : 'nice-slider-slide'"
             th:with="maxValue = ${ totalSize lt (listIndex + noEl -1) ? totalSize : listIndex + noEl -1}">
            <div class="nice-slider-entry" th:each="index : ${#numbers.sequence(listIndex, maxValue)}">
                <span th:text="${myList[index]}"></span>
            </div>
        </div>
    </th:block>
</th:block>

推荐阅读