код ruby ​​для отображения множества изображений в карусели

Мне нужно отобразить более 30 изображений в загрузчике карусели-твиттера. Итак, я написал код, как упоминалось там. Код для отображения одного изображения выглядит следующим образом:

<div id="carousel" class="carousel">
  <div class="carousel-inner">  
    <div class="item active">
      <%= image_tag('1.JPG',:size => '600x400', :alt => "College Building") %>
    <div class="carousel-caption"></div>
  </div> 
</div>

Приведенный выше HTML-код предназначен для отображения одного изображения в карусели. Точно так же для других изображений мы должны снова написать тот же код с именем другого изображения. Мой вопрос заключается в том, как написать код на рубине для отображения нескольких изображений. я пробовал использовать массив, например

# in controller
@image["1.jpg","2.jpg",...] 
@image.each do|n|

# in HTML page
<%=image_tag("n",:size => '600x400')%> 

Я новичок, поэтому, если возможно, объясните код.


person ahmad_719    schedule 04.08.2012    source источник


Ответы (2)


Похоже, ваш код находится на правильном пути:

Контроллер:

# You have to assign the array to the @images variable
@images = [ "1.jpg", "2.jpg", ... ]

Вид:

<% @images.each do |n| %>

  <%

  # You have to use the `n` variable, not the literal
  # string "n" that you used in your sample code. Notice
  # the lack of quotes here:

  %>

  <%= image_tag( n, :size => '600x400' ) %> 

<% end %>

Возможно, вы захотите назначить массив хэшей, чтобы вы могли хранить дополнительную информацию помимо имени файла изображения, например:

Контроллер:

@images = [

  { 'file' => "1.jpg", 'alt' => "College Building" },

  { 'file' => "2.jpg", 'alt' => "Something else" }

]

Вид:

<% @images.each do |image| %>

  <%= image_tag(

    image[ 'file' ], :size => '600x400', :alt => image[ 'alt' ]

  ) %>

<% end %>
person JMM    schedule 04.08.2012
comment
эй большое спасибо. Я использовал ваш метод, но, к сожалению, получил эту ошибку. %› ‹%= image_tag( image[ 'file' ], :size =› '600x400', :alt =› image[ 'alt' ] ) %› ‹% end %› ‹%end%›. Теперь ошибок нет, но изображения все равно не отображаются в карусели. Пожалуйста, загляните в него..!! - person ahmad_719; 05.08.2012
comment
Хм, что-то должно быть не так. Убедитесь, что у вас одинаковое имя переменной в обоих местах, например. @images. Вы можете указать это в своем представлении, чтобы убедиться, что у вас есть правильное значение: <%= debug @images %>. Когда вы дойдете до точки, где это показывает правильное значение, each должен работать. - person JMM; 05.08.2012

  1. Я обычно загружаю все изображения карусели в папку assets/images с буквой «c», оканчивающейся на их имя. (например, towerc.jpg). Может загрузить столько, сколько вы хотите.

  2. Предположим, что первым изображением будет welcome.jpg (потому что обычно это комбинация изображения/текста, по крайней мере, в моем случае).

  3. Загрузите переменную (@pics в моем случае) со всеми соответствующими фотографиями из папки)

  4. пройти через массив в представлении для отображения изображений.

  5. Не забудьте поиграться с высотой и шириной # (xxx, yyy)

    <!--  file names ending with c.(jpg,png,gif,jpeg) are carousel only-->
    <!--  welcome.jpg is first active file, usually something special.-->
    

        <div class="active item">
          <%= image_tag("welcome.jpg", :width=>"xxx", :height=>"yyy")%>
        </div>
    
        <% @pics.each do |photos| %>
            <div class="item">
              <%= image_tag(photos[18..photos.length], :width=>"xxx", :height=>"yyy")%>
            </div>          
        <% end %>
    
      </div>
    
      <a class="carousel-control left" href="#myCarousel" data-slide="prev">&saquo;</a>
      <a class="carousel-control right" href="#myCarousel" data-slide="next">&aquo;</a>
    </div>
    

Кстати, решение JMM должно работать, просто пытаясь подчеркнуть, что вы должны хранить изображения в папке assets/images и получать их оттуда.

person sal    schedule 07.08.2012