Question

当我想在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 %>

我想做一些不同的事情。我想显示第一行中的前两个项目，第二行中的后两个项目等。概念上如下：

<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>

我觉得这不应该太难，但我不知道如何完成它。非常感谢任何帮助！

Answer 1

您可以使用in_groups_of method之类的：

<% @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 %>

使用in_groups_of，您可以将@items集合分成一组，每组2个项目并对其进行迭代。

<强>更新

@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 %>

Answer 2

您可以使用ActiveSupport提供的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 %>
      <div class="col-xs-6"><%= item2.attribute1 %></div>
      <div class="col-xs-6"><%= item2.attribute2 %></div>
    <% end %>
  </div>
<% end %>

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

2 个答案: