Ruby ERB 页面:在 for 循环中并排呈现两个部分
Ruby ERB Page: Render two partials side by side in a for loop
我是 Ruby ERB 页面的新手,正在尝试使用它来呈现我的博客。目前我有这个 for 循环,它在博客页面
上每行呈现一个 post
<% @posts.each do |post| %>
<%= render :partial => 'post', :locals => {:post => post} %>
<% end %>
但是,由于这是一个 for-each 循环,我无法在一次迭代中访问两个元素来告诉循环在每一行上并排呈现两个 post。如何更改此 for 循环以在一行上并排呈现两个 post?
如果您真的必须输出到两个单独的包装器元素中,您将从拆分集合开始。
<% odd, even = arr.partition.with_index{ |_, i| i.even? } %>
<div class="column odd">
<% odd.each do |post| %>
<%= render :partial => 'post', :locals => {:post => post} %>
<% end %>
</div>
<div class="column even">
<% even.each do |post| %>
<%= render :partial => 'post', :locals => {:post => post} %>
<% end %>
</div>
这就是 2008 年左右的情况,当时您的网页设计基于 720 或 960 像素的宽度。
现在用 CSS 可以更好地解决这个问题。
如果您正在使用 Bootstrap,您也可以使用类似的东西
<% @posts.in_groups_of(2).each do |posts| %>
<% # posts is an Array of 2 items %>
<div class="col-md-4"><%= render :partial => 'post', :locals => {:post => posts[0]} %></div>
<div class="col-md-4"><%= render :partial => 'post', :locals => {:post => posts[0]} %></div>
<% end %>
我是 Ruby ERB 页面的新手,正在尝试使用它来呈现我的博客。目前我有这个 for 循环,它在博客页面
上每行呈现一个 post<% @posts.each do |post| %>
<%= render :partial => 'post', :locals => {:post => post} %>
<% end %>
但是,由于这是一个 for-each 循环,我无法在一次迭代中访问两个元素来告诉循环在每一行上并排呈现两个 post。如何更改此 for 循环以在一行上并排呈现两个 post?
如果您真的必须输出到两个单独的包装器元素中,您将从拆分集合开始。
<% odd, even = arr.partition.with_index{ |_, i| i.even? } %>
<div class="column odd">
<% odd.each do |post| %>
<%= render :partial => 'post', :locals => {:post => post} %>
<% end %>
</div>
<div class="column even">
<% even.each do |post| %>
<%= render :partial => 'post', :locals => {:post => post} %>
<% end %>
</div>
这就是 2008 年左右的情况,当时您的网页设计基于 720 或 960 像素的宽度。
现在用 CSS 可以更好地解决这个问题。
如果您正在使用 Bootstrap,您也可以使用类似的东西
<% @posts.in_groups_of(2).each do |posts| %>
<% # posts is an Array of 2 items %>
<div class="col-md-4"><%= render :partial => 'post', :locals => {:post => posts[0]} %></div>
<div class="col-md-4"><%= render :partial => 'post', :locals => {:post => posts[0]} %></div>
<% end %>