在thymeleaf,怎么写:每个组合行和列？

Question

我想像这样连续写4列

<div class="row">
   <div class="span3">Something</div>
   <div class="span3">Something</div>
   <div class="span3">Something</div>
   <div class="span3">Something</div>
</div>
<div class="row">
   <div class="span3">Something</div>
   <div class="span3">Something</div>
   <div class="span3">Something</div>
   <div class="span3">Something</div>
</div>

数据大小是动态的,因此它可以是4,8或更多.这是在其他模板引擎中存档的

{{#each list}}
  {{#if @index % 4 == 0}}
    <div class="row">
  {{/if}}
  <div class="span3">{{this.name}}</div>
  {{#if @index % 4 == 0}}
    </div>
  {{/if}}
{{/each}}

但是我如何在百里香中存档呢？我找不到方法因为th:each在标签(<div class="row">或<div class="span3">)中作为属性.

Answer 1

型号代码

List<String> data = new ArrayList<String>();
data.add("1");
data.add("2");
data.add("3");
data.add("4");
data.add("5");
data.add("6");
data.add("7");
data.add("8");

model.addAttribute("datas", data);

Thymeleaf视图代码

<div th:each="data, row: ${datas}" th:with="numList=${#strings.listSplit('3,2,1,0', ',')}" th:if="${row.current} % 4 == 0" class="span3">
    <span th:each="num : ${numList}" th:with="dataIndex=(${row.index} - ${num})" th:text="${datas[dataIndex]}">data</span>
</div>

结果

<div class="span3">
    <span>1</span><span>2</span><span>3</span><span>4</span>
</div>
<div class="span3">
    <span>5</span><span>6</span><span>7</span><span>8</span>
</div>

我使用数组来解决这个问题.我想你会找到一个更好的方法.

Answer 2

这也可以使用numbers.sequence。设置colCount为您想要的任何列数：

<th:block th:with="colCount=${4}">
    <div th:each="r : ${#numbers.sequence(0, datas.size(), colCount)}"  class="row">
        <div th:each="c : ${#numbers.sequence(0, colCount - 1)}" th:if="${r + c &lt; datas.size()}" th:text="${datas.get(r + c)}" class="span3"></div>
    </div>
</th:block>