0

我正在使用轮播来显示图像。我已经将图片上传到云端。但不知何故,它正在自我重复。这是我的代码

div id="myCarousel" class="carousel slide">
<div class="carousell-inner">
    <% @img.each_with_index do |i|%>
    <% if i.gallery == "Art"%>
        <div class="active item">
            <%= image_tag (i.image.url) %>
        </div>

        <% i.next%> <!-- For incrementing the i value but it is not working-->
        <div class="item">
            <%= image_tag (i.image.url)%>   
        </div>
    <%end%> 
    <%end%>
    </div>
</div>

我想要的是active item它应该显示图像数组的第一个 url,并且在非活动项目(之后将是活动的)中应该有其他图像。它不应该重复图像。在这里它正在重复图像,因为 的值i没有改变。

4

3 回答 3

0

我一开始以为你需要each_with_index,但实际上,你只对Art图库中的图像感兴趣,不知道第一张图像是否真的是Art图像,所以我尝试如下:

<div id="myCarousel" class="carousel slide">
  <div class="carousell-inner">
    <% art_images_counter = 0 %>
    <% @img.each do |image|%>
      <% if image.gallery == "Art" %>
        <% if art_images_counter == 0 %>
          <div class="active item">
            <%= image_tag (image.image.url) %>
          </div>
        <% else %>
          <div class="item">
            <%= image_tag (image.image.url)%>   
          </div>
        <% end %>
        <% art_images_counter += 1 %>
      <%end%> 
    <%end%>
  </div>
</div>

希望这可以帮助。

于 2012-12-12T16:00:00.650 回答
0

我开始了解您想要什么:) 如果您将数据分开,您可以使您的逻辑非常简单。

<div id="myCarousel" class="carousel slide">
    <div class="carousell-inner">
    <% @img.keep_if{|i| i.gallery == "Art"}.each do |i|%>
        <div class="active item">
            <%= image_tag (i.image.url) %>
        </div>
    <%end%>

    <% @img.keep_if{|i| i.gallery != "Art"}.each do |i|%>
        <div class="item">
            <%= image_tag (i.image.url)%>   
        </div>
    <%end%>
    </div>
</div>

最好在控制器中准备数据,而不是在视图中。

于 2012-12-12T13:22:53.077 回答
0

我通过手动找到答案。首先,在控制器中,我Art Gallery通过此代码找到了属于 的所有图像。

 @image = Image.find_all_by_gallery("Art")

现在要显示数组的第一个元素@image,我们可以使用简单的@image.first,然后我们可以在 carousel 的活动项中调用数组的第一个元素。那么对于该item部分,基本要了解的是,如果我们直接调用并显示数组的所有元素,那么数组的第一个元素也会显示在这部分。所以可能会发生重复。为了避免这种情况,我们可以这样做:

i = @image.count
@image[1..i]

这样第一个元素就不会在轮播的“项目”部分重复。希望它可以帮助其他人。谢谢你给我时间。

于 2012-12-12T14:31:05.320 回答