Rails + Bootstrap:如何迭代每行包含多个项目的项目集合

set*_*ine 2 ruby-on-rails twitter-bootstrap

当我想在Rails视图中显示一组东西时,我通常会这样做:

<% @items.each do |item| %>
  <div class="row">
    <div class="col-xs-6"><%= item.attribute1 %></div>
    <div class="col-xs-6"><%= item.attribute2 %></div>
  </div>
<% end %>
Run Code Online (Sandbox Code Playgroud)

我想做一些与众不同的事情.我想在第一行显示前两个项目,在第二行显示下两个项目.概念上如下:

<div class="row">
  <div class="col-xs-3"><%= item.attribute1 %></div> <!-- first item in collection -->
  <div class="col-xs-3"><%= item.attribute2 %></div> <!-- first item in collection -->

  <div class="col-xs-3"><%= item.attribute1 %></div> <!-- second item in collection -->
  <div class="col-xs-3"><%= item.attribute2 %></div> <!-- second item in collection -->
</div>
Run Code Online (Sandbox Code Playgroud)

我觉得这不应该太难,但我不知道如何完成它.任何帮助深表感谢!

Kir*_*rat 8

您可以使用in_groups_of方法,如:

<% @items.in_groups_of(2) do |item1, item2| %>
  <div class="row">
    <div class="col-xs-6"><%= item1.attribute1 %></div>
    <div class="col-xs-6"><%= item1.attribute2 %></div>
    <% if item2 %> <%# To take care of odd groups %>
      <div class="col-xs-6"><%= item2.attribute1 %></div>
      <div class="col-xs-6"><%= item2.attribute2 %></div>
    <% end %>
  </div>
<% end %>
Run Code Online (Sandbox Code Playgroud)

有了in_groups_of你可以组@items一组的2项各收集和遍历它.

UPDATE

@items是使用生成的gem tire,实际上是类的Tire::Results::Collection类型.在这种情况下,您需要先将其转换为数组,然后in_groups_of在其上应用方法,如下所示:

<% @items.to_ary.in_groups_of(2) do |item1, item2| %>
  <div class="row">
    <div class="col-xs-6"><%= item1.attribute1 %></div>
    <div class="col-xs-6"><%= item1.attribute2 %></div>
    <% if item2 %> <%# To take care of odd groups %>
      <div class="col-xs-6"><%= item2.attribute1 %></div>
      <div class="col-xs-6"><%= item2.attribute2 %></div>
    <% end %>
  </div>
<% end %>
Run Code Online (Sandbox Code Playgroud)