在html模板中顯示由管理員上傳的圖像

Question

我是django的新手，但我看到了解決問題的方法，但沒有一個有效。

如您在models.py的Item類中看到的，我讓管理員上傳圖像：

from django.db import models
from django.contrib import admin


class Customer (models.Model):
    username = models.CharField(max_length=500)
    email = models.CharField(max_length=1000 , unique=True)
    phone = models.IntegerField()
    address = models.CharField(max_length=3000)


class Category(models.Model):
    category_title = models.CharField(max_length=100 , unique=True)

    def __str__(self):
        return self.category_title


class Order (models.Model):
    time = models.DateTimeField(auto_now_add=True)
    total = models.IntegerField()
    created_by = models.ForeignKey(Customer, related_name='orders')


class Item (models.Model):
    name = models.CharField(max_length=100 ,unique=True)
    details = models.CharField(max_length=1000)
    price = models.IntegerField()
    item_logo = models.ImageField(upload_to='res/static/res/images')
    category = models.ForeignKey(Category, related_name="items" ,on_delete= models.CASCADE)

    def __str__(self):
        return self.name


class ItemInline(admin.TabularInline):
    model = Item

class CategoryAdmin(admin.ModelAdmin):
    inlines = [
        ItemInline,
    ]

因此，如何使這些圖像顯示在HTML中（請注意：html代碼可以正常工作，但是會出現一個小的默認圖像字段而不是image）：

{% extends 'res/menu.html' %}
{% block content %}
<h1>hello</h1>

    <table class="table table-striped table-bordered" style="text-align: left ; border-color: black;" id="pizza_table">
        <tbody>
            {% for item in items %}
                <td>
                    {{ item.name }}
                    <p>{{ item.details }}</p>
                </td>
                <td>
                    <img src="{{item.item_logo}}">
                </td>
                <td>

                </td>
                <td>
                    <button type="button" class="btn btn-success" style="margin: 5px ;" onclick="additem('Seafood Pizza', 20 ) ;">Add</button>
                </td>
            {% endfor %}
        </tbody>
    </table>

{% endblock %}

提前致謝

Answer 1

來自文檔的 Qoute：

在模型中使用FileField或ImageField（請參見下文）需要執行以下步驟：

在您的設置文件中，您需要將MEDIA_ROOT定義為您希望Django存儲上載文件的目錄的完整路徑。 （為了提高性能，這些文件未存儲在數據庫中。）將MEDIA_URL定義為該目錄的基本公共URL。 確保該目錄可由Web服務器的用戶帳戶寫入。

將FileField或ImageField添加到模型中，定義upload_to選項，以指定用於上載文件的MEDIA_ROOT的子目錄。

將存儲在數據庫中的所有文件都是該文件的路徑（相對於MEDIA_ROOT）。 您很可能想使用Django提供的便捷url屬性。 例如，如果您的ImageField名為mug_shot，則可以使用{{object.mug_shot.url}}在模板中獲取圖像的絕對路徑。

另外，您還需要修改URL以在開發過程中提供媒體文件。

因此，您需要在設置文件中添加MEDIA_ROOT和MEDIA_URL ：

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

添加到URL文件：

urlpatterns = [
    # ... the rest of your URLconf goes here ...
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

並在模板內添加url方法：

<img src="{{item.item_logo.url}}">