在模板中显示上传的图像 - Django

tim*_*tim 2 django django-templates django-related-manager pillow

我正在尝试将上传的图像显示到我想象中的蔬菜目录的模板中.

我有一个页面添加一个新的蔬菜和上传图像.主模板是一个蔬菜列表,稍后会有缩略图.

现在,当查看蔬菜的详细页面时,我想显示其图像,但模板只显示字符串'VegetableImage Object'代替图像,即使使用img标签.

我很困惑,因为模板显然已经找到了图像,但它们只是作为通用字符串显示.

models.py

class Vegetable(models.Model):
        title = models.CharField(max_length=0)
        category = models.CharField(max_length=50,
                                    choices=CATEGORY_CHOICES)
        thumbnail = models.ImageField(upload_to = 'uploaded_images/')


class VegetableImage(models.Model):
    vegetable = models.ForeignKey(Vegetable, default=None, related_name='images')
    image = models.ImageField(upload_to='images/vegetable',
                             verbose_name='image',)
Run Code Online (Sandbox Code Playgroud)

查看主模板(所有蔬菜的列表)和详细视图

class VegetableView(generic.ListView):
    template_name = 'vegetable/vegetable.html'
    context_object_name = 'vegetable_list'

    def get_queryset(self):
        return Vegetable.objects.all()

class DetailView(generic.DetailView):
    model = Vegetable
    template_name = 'vegetable/detail.html'
Run Code Online (Sandbox Code Playgroud)

显示菜细节的细节模板

{% if view %}
    <h1>Title: {{ vegetable.title }}</h1>
    <h2>Category: {{ vegetable.category }}</h2>
    <p>Thumbnail: {{ vegetable.thumbnail }}</p>
    <p>Images:     
{% for vegetable in vegetable.images.all %}
    {{ vegetable }}
    {% endfor %}
</p>


{% else %}
    <p> no vegetables found - error </p>
{% endif %}
Run Code Online (Sandbox Code Playgroud)

Wto*_*wer 5

尝试使用模板中的以下代码显示图像:

<img src="{{ vegetable.image.url }}" alt="...">
Run Code Online (Sandbox Code Playgroud)

这是您从imagefield对象访问URL的方式.

更详细的技术细节,ImageField继承自FileField.由于这是规定的文件中:

当您访问FileField模型时,您将获得一个FieldFile作为访问底层文件的代理的实例...

因此:

FieldFile.url

一个只读属性,用于通过调用url()基础Storage类的方法来访问文件的相对URL .

在开发中显示上载的用户文件,您需要更改URL.