Question

我有对象列表，我想使用Play Framework模板进行渲染。

@(cats: List[Category])

@category(cat: Category) = {
    <td><button class="btn btn-info">@cat.name</button></td>
}

<div class="modal-body">
    <table class="table">
        <tbody>
            @cats.map { case cat =>
                @category(cat)
            }
        </tbody>
    </table>
</div>

因此，如果我在列表中有9个元素，它们都将在一行中。

我想拥有的是一行，最多包含3个元素。所以它会像：

A B C 
D E F 
G H I

我以为我可以用索引列表压缩我的列表并将每个第三个元素设置为新行。但我不知道该怎么做。

想法？

感谢。

Answer 1

您可以使用grouped对列表进行分组，它将返回列表列表：

scala> List(1,2,3,4,5,6).grouped(3).toList
res13: List[List[Int]] = List(List(1, 2, 3), List(4, 5, 6))

在你的情况下应该是这样的：

@(cats: List[String])

@category(groupedCats: List[String]) = {
    @groupedCats.map { cat =>
        <td><button class="btn btn-info">@cat</button></td>
    }
}

<div class="modal-body">
  <table class="table">
    <tbody>
      @cats.grouped(3).toList.map { grouped =>
        <tr>@category(grouped)</tr>
      }
    </tbody>
  </table>
</div>

通过这种方式，您可以传递@category 3个元素的列表，这些元素包含在td标记中。

Answer 2

当然你可以zipWithIndex并且你不需要对它进行分组，而是使用模块比较：

<table>
  <tr>
    @for((cat, index) <- cats.zipWithIndex) {
        <td>@cat</td>
        @if((index+1) % 3 == 0){</tr><tr>}  @* Close old row if has 3 elements and open new *@
    }
  </tr>
</table>

播放框架模板：如何在表中开始新行？

2 个答案: