Question

我在同一页面上列出了100个属性。我使用bootstrap作为视图。

这是每个循环的属性的一部分。

#myCarousel.carousel.slide
    .carousel-inner
     - house.attachments.limit(9).each_with_index do |a, index| 
         %div{ :class => "#{index == 0 ? 'active item' : 'item'}" }
           = link_to(image_tag(a.file.url))


     %a.carousel-control.left{"data-slide" => "next", :href => "#myCarousel"} ‹
     %a.carousel-control.right{"data-slide" => "prev", :href => "#myCarousel"} ›

这会产生

<div class='carousel slide' id='myCarousel'>

<div class='carousel-inner'>
<div class='active item'>
<a href="/italie/umbrie/houses/tags/design-vakantiehuizen-umbrie?locale=nl"><img alt="1000-uitzicht" src="/uploads/attachment/file/1053/1000-uitzicht.jpg" /></a>
</div>
<div class='item'>
<a href="/italie/umbrie/houses/tags/design-vakantiehuizen-umbrie?locale=nl"><img alt="1000-stoelenbijzwembad" src="/uploads/attachment/file/1054/1000-stoelenbijzwembad.jpg" /></a>
</div>
<div class='item'>
<a href="/italie/umbrie/houses/tags/design-vakantiehuizen-umbrie?locale=nl"><img alt="1000-bad2" src="/uploads/attachment/file/1061/1000-bad2.jpg" /></a>
</div>
</div>
<a class='carousel-control left' data-slide='next' href='#myCarousel'>‹</a>
<a class='carousel-control right' data-slide='prev' href='#myCarousel'>›</a>
</div>
</div>

我想在id mycarousel和控件元素中添加增量编号。喜欢这个

#myCarousel1.carousel.slide
 %a.carousel-control.left{"data-slide" => "next", :href => "#myCarousel1"} ‹
 %a.carousel-control.right{"data-slide" => "prev", :href => "#myCarousel1"} ›
#myCarousel2.carousel.slide
 %a.carousel-control.left{"data-slide" => "next", :href => "#myCarousel2"} ‹
 %a.carousel-control.right{"data-slide" => "prev", :href => "#myCarousel2"} ›
ect

如何在each_with_index循环中添加增量？

thanks..remco

Answer 1

您可以先使用in_groups_of分批批量分割10个。像（没有HTML）的东西：

group_index = 0 # unfortunately no index with in_groups_of
house.attachments.in_groups_of(10, false) do |att_group|
  # display header, start div
  # use group_index or group_index * 10 to generate id's
  att_group.each_with_index do |a, index|
    # display items
  end
  # display footer/controls
  group_counter += 1
end

除了group_index递增每个组，您还可以让它递增每个项目，如果更方便的话。

为增加轮播目的而增加视图

1 个答案: