web-dev-qa-db-fra.com

Comment convertir <img src => en image_tag dans l'application Rails

Ceci est mon premier post ici et cela peut paraître terriblement stupide. Je construis ma première application Rails.

J'ai cette ligne dans mon index.html.erb

    <img src="/assets/Rand_front/<%= @random_image%>", style='height:50vw;width:100vw;margin-bottom:20px;' >

Je veux utiliser image_tag au lieu du img src

Quelle est la bonne façon de l'envelopper dans le code?

Jusqu'à présent, j'ai essayé <%= image_tag ( "/assets/Rand_front/<%= @random_image%>", style='height:50vw;width:100vw;margin-bottom:20px;') %>

et <%= image_tag ( "/assets/Rand_front/<%= @random_image%>"), style='height:50vw;width:100vw;margin-bottom:20px;' %>

et beaucoup d'autres versions, mais aucune ne semble fonctionner, qu'est-ce que je fais de travers? et comment devrais-je l'écrire correctement?

ce <%= @random_image%> bit prend cette variable de la méthode index dans le contrôleur.

def index
   @products = Product.all.order(created_at: :desc).group_by(&:category_id)
    @images  = ["1.jpg", "2.jpg", "3.jpg", "4.jpg", "5.jpg", "6.jpg", "7.jpg", "8.jpg", "9.jpg", "10.jpg"]
    @random_no = Rand(10)
    @random_image = @images[@random_no]
end
htmlcssruby-on-railsruby
6
Slowboy
<%= image_tag ( "Rand_front/#{@random_image}", style='height:50vw;width:100vw;margin-bottom:20px;') %>

image_tag ajoutera automatiquement assets au début du chemin

check Image Tag pour la documentation

7
Qaisar Nadeem

C'est ce que Ruby on Rails traite explicitement

 <%= image_tag("source", {:style => "width:100px;"}) %>

(ce qui signifie que Ruby vous permet d’utiliser ce code sans le ({}), 

Pour moi, tout d'abord, il est important de savoir que c'est ainsi que Ruby on Rails exécute le code. 

En d'autres termes, OUI, vous pouvez laisser la formalité ({}) en dehors parce que Ruby comprendra votre code, espérons que cela aidera à clarifier certains ... 

2
jso1919

Si je ne me trompe pas, vous avez un dossier Rand_front dans votre dossier assets. Vous devez donc appeler image_tag("#{@random_image}") car, par défaut, l'assistant image_tag devrait vérifier le nom de l'image dans tous les dossiers du répertoire assets.

Pour les propriétés CSS, vous pouvez envisager d'utiliser le hash options qui vous permettrait de transmettre les propriétés CSS en tant que clés avec les valeurs souhaitées.

image_tag("#{@random_image}", height: 20, width: 20) Vous pouvez consulter la documentation de la réponse précédente

1
Black Enigma