How to add django template variable in <img src>?

问题

I have a Photo model with two fields:

title = models.CharField()
path = models.CharField()

When I adding the new photo in admin panel, the path is equals to /images/image_ex.jpg This is my view file:

def gallery(request):
   photos = Photo.objects.all()
   return render(request, 'gallery.html', {'photos': photos})

This is the tag in gallery.html:

{% loadstaticfiles %}
<img src="{%static '{{photo.path}}'%}"/>

The problem is that the photo does not render and if I look in the code of the page, the src is equals to something like that:

src="static/%7B%7B%20photo.path%20%7D%7D"

What is the problem? How can I use template variables in src? P.S. The images folder exists in static folder, the image exists too. I added static directory to settings.py. Also if I change src to a normal one, like

<img src="{static 'images/image_ex.png'%}">

The photo renders normally.

回答1:

You here pass '{{photo.path}}' as a string to {% static ... %}, hence it will simply prepend the static URL root to this string.

If you want to use the content of photo.path, you can use:

<img src="{% static photo.path %}"/>

So {% static ... %} accepts variables as parameters, and will take the content of the path attribute of the photo variable. (of course given that variable is passed, or is a variable you generate with {% for ... %} loops, etc.

回答2:

Uses a for tag

{% for p in photos %}
    <img src="{% static '{{ p.path }}' %}"/>
{% endfor %}

Better uses Imagefield as field in your model

In your settings.py

MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'

Create a folder named “media” in your project (at the same level that your apps)

In your urls.py (main)

from . import views, settings
from django.contrib.staticfiles.urls import static
from django.contrib.staticfiles.urls import staticfiles_urlpatterns


urlpatterns += staticfiles_urlpatterns()
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

In your models.py

Replace the CharField with Imagefield

image = models.ImageField(upload_to="my_folder_name")

Like this:

class Photo(models.Model):
    title = models.CharField()
    image = models.ImageField(upload_to="my_folder_name"))

In your views.py

def gallery(request):
   photos = Photo.objects.all()
   return render(request, 'gallery.html', {'photos': photos})

In your templates

{% for p in photos %}
    <img src="{{ p.photo.url }}"/>
{% endfor %}

回答3:

Do it like this:

<img src="{static 'images/'%}{{image_ex.png}}">

Use it after the static tag scope ends.

来源：https://stackoverflow.com/questions/52803129/how-to-add-django-template-variable-in-img-src