ruby-on-rails - 通过更改 html( Bootstrap 轮播)来 Rails 每种方法

Question

所以，我正在尝试为 Rails 4 中的 Bootstrap 3 轮播找出一个解决方案。

我有这个:

  <li> <a id="carousel-selector-0" class="selected">
    <%= image_tag @gallery.images[0].photo.url(:thumb), class: 'img-responsive' %>
  </a></li>
  <li> <a id="carousel-selector-1">
    <%= image_tag @gallery.images[1].photo.url(:thumb), class: 'img-responsive' %>
  </a></li> 


 ...etc...

我正在寻找一种 each 类型的方法来解释图库中可变数量的图像。

第一张照片看起来像这样:

  <li> <a id="carousel-selector-0" class="selected">
    <%= image_tag @gallery.images[0].photo.url(:thumb), class: 'img-responsive' %>
  </a></li>

它之后的那些看起来像:

<li> <a id="carousel-selector-1">
    <%= image_tag @gallery.images[1].photo.url(:thumb), class: 'img-responsive' %>
  </a></li> 
.......

当然，每张照片每个数字都会增加一个。

感谢您的帮助!

解决方案

谢谢你的创意原因!

这是有效的:

<% @gallery.images.each_with_index do |image, index| %>
  <li> <a id="carousel-selector-<%=index%>" class="<%= 'selected' if index == 0%>">
    <%= image_tag image.photo.url(:thumb), class: 'img-responsive' %>
  </a></li>
  <% end%>

如果有人正在寻找 .carousel-inner div 的解决方案(几乎相同):

<div class="carousel-inner">
            <% @gallery.images.each_with_index do |image, index| %>
                <div class="item <%= 'active' if index == 0%>" data-slide-number="<%= index %>">
                  <%= image_tag image.photo.url(:large), class: 'img-responsive' %>
                </div>
            <% end%>
            </div>

Answer 1

像这样的东西应该可以工作:

<% @gallery.images.each_with_index do |image, index| %>
  <li> <a id="carousel-selector-<%=index%>" class="<%='selected' if index == 0%>">
    <%= image_tag image.photo.url(:thumb), class: 'img-responsive' %>
  </a></li>
  <% end%>

修改:因为我没有注意到li标签中selected的区别。现在我正在使用 each_with_index