如何将背景图像设置为回形针附件url ?

Question

我在获取回形针附件URL来设置背景图像的样式时遇到了麻烦。以下是我的观点:

  <% @auction.lots.each do |lot| %>
    <div class="lot-with-image" style="background-image: url('#{request.protocol}#{request.host_with_port}#{lot.image}'); width: 300px; height: 300px; border: 5px solid black"></div>
  <% end %>

这是html:

<div class="lot-with-image" style="background-image: url('#{request.protocol}#{request.host_with_port}#{lot.image}'); width: 300px; height: 300px; border: 5px solid black">

我也尝试了#{lot.image.url}，但我得到了几乎相同的结果。

如果有更好的方法使用回形针样式背景图像，我非常开放的建议。

Answer 1

<% @auction.lots.each do |lot| %>
    <div class="lot-with-image" style="background-image: url('<%= lot.image.url %>'); width: 300px; height: 300px; border: 5px solid black"></div>
<% end %>

Answer 2

请改成:

<% @auction.lots.each do |lot| %>
    <div class="lot-with-image" style="background-image: url("<%= lot.image.url %>"); width: 300px; height: 300px; border: 5px solid black"></div>
<% end %>