webentwicklung-frage-antwort-db.com.de

Auch konvertieren Sie <img src => in image_tag in der Rails-App

Dies ist mein erster Beitrag hier und es hört sich vielleicht furchtbar dumm an. Ich baue meine erste Rails-App.

Ich habe diese Zeile in meinem index.html.erb

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

Ich möchte image_tag anstelle von img src verwenden.

Wie kann ich den Code richtig umschließen?

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

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

und viele andere Versionen, aber keine scheint zu funktionieren, was mache ich falsch? und wie soll ich es richtig schreiben?

dieses <%= @random_image%>-Bit übernimmt diese Variable von der index-Methode im Controller.

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
6
Slowboy
<%= image_tag ( "Rand_front/#{@random_image}", style='height:50vw;width:100vw;margin-bottom:20px;') %>

image_tag fügt am Anfang des Pfads automatisch assets hinzu

check Image Tag für Dokumentation

7
Qaisar Nadeem

Dies wird von Ruby on Rails explizit verarbeitet

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

(was bedeutet, dass Ruby Ihnen erlaubt, diesen Code ohne ({}) zu verwenden, 

Für mich ist es zunächst wichtig zu wissen, dass Ruby on Rails den Code tatsächlich ausführt. 

Mit anderen Worten: Ja, Sie könnten die ({}) -Formalität auslassen, da Ruby Ihren Code verstehen wird. Ich hoffe, das hilft, einige zu klären ... 

2
jso1919

Wenn ich mich nicht irre, haben Sie einen Rand_front-Ordner in Ihrem Assets-Ordner. Sie sollten image_tag("#{@random_image}") aufrufen, da der image_tag-Helper standardmäßig alle Ordner im Assets-Verzeichnis auf den Namen des Images überprüft

Für die CSS-Eigenschaften können Sie die Verwendung des Hashes options in Betracht ziehen, mit dem Sie die CSS-Eigenschaften als Schlüssel mit den gewünschten Werten übergeben können

image_tag("#{@random_image}", height: 20, width: 20) Sie können die Dokumentation in der vorherigen Antwort auschecken

1
Black Enigma