图像未从多模型视图呈现在 Django 模板上

Images are not rendering on Django template from a multi-model view

问题: 我无法让图像出现在我的模板上 plant_detail.html。我认为我错误地调用了变量,但不确定要更改什么。

上下文:

我创建了一个模型 PlantImage,它允许我在我的模型中关联多个图像 Plant

然后我创建了一个基于 class 的视图 PlantDetailView 到 link 这两个模型,PlantImage一起种植

但是,现在当我尝试在模板 plant_detail.html 中显示这些图像时,什么也不会出现。如何让图像出现在我的模板上?

我尝试通读 Django 文档、阅读文章和观看 youtube 视频,但我不确定我遗漏了什么或需要编辑什么。

我的文件:

plants/models.py

class Plant(models.Model):
    name = models.CharField(max_length=120)
    slug = models.SlugField(null=False, unique=True)
    description = models.TextField()

    def __str__(self):
        return self.name

    def get_absolute_url(self):
        return reverse("plant_detail", kwargs={"slug": self.slug})

class PlantImage(models.Model):
    plant = models.ForeignKey(Plant, default=None, on_delete=models.CASCADE)
    images = models.ImageField(upload_to = 'images/')
 
    def __str__(self):
        return self.plant.name

plants/views.py

def plant_index(request):
    plant_objects = Plant.objects.all()
    context = {'plant_objects': plant_objects}
    return render(request, 'plants/plant_index.html', context)

class PlantDetailView(DetailView):
    model = Plant
    template_name = 'plants/plant_detail.html'
    slug = 'slug'

    def get_context_data(self, **kwargs):
        context = super(PlantDetailView, self).get_context_data(**kwargs)
        context['plant_images'] = PlantImage.objects.all()
        return context

plant_detail = PlantDetailView.as_view()

plants/urls.py

from django.urls import path
from .views import plant_index, plant_detail

app_name = 'plants'
urlpatterns = [
    # ex: /plants/
    path('', plant_index, name='plant_index'),
    # ex: /plants/pothos/
    path("<slug:slug>", plant_detail, name="plant_detail"),
]

plants/plant_detail.html

{% block content %}
<body>
    <h1> {{ plant.name }} </h1>
    <br>
    <p> <b>Latin Name: </b>{{ plant.latin_name }} </p>
    <br>
    <p><b>Description: </b></p>Dj
    <p> {{ plant.description }} </p>
    <br>
    <br>
    <p>Images:</p>
    <br>
    {% for image in plant_images %}
    <p><img src="{{ plant.images }}" width="300px"></p>
    {% endfor %}
</body>
{% endblock content %}

settings.py

MEDIA_URL = '/media/'
MEDIA_ROOT = str(BASE_DIR.joinpath('mediafiles'))

输出截图:

代码“PlantImage.objects.all()”不仅获取特定图像相关的植物,还获取其他图像。

所以如果你想从 Plant 访问 PlantImage,你必须写 related_name。

https://docs.djangoproject.com/en/4.0/ref/models/fields/#django.db.models.ForeignKey.related_name

class PlantImage(models.Model):
    plant = models.ForeignKey(Plant, default=None, on_delete=models.CASCADE, related_name="plant_images")
    ...

ImageField继承FileField。所以,你必须了解一些Filefield函数。

https://docs.djangoproject.com/en/4.0/ref/models/fields/#filefield-and-fieldfile

如果要显示图片,请像这样添加'.url'。

{% for image in plant.plant_images.all %}
<p><img src="{{ image.images.url }}" width="300px"></p>
{% endfor %}