Python / Django - 创建照片库 - 获取图片＆＃39;名字而不是自己的照片

Question

由于缺乏经验，我遇到以下问题：我没有在图库页面中获取照片。

主要想法是创建一个非常简单的照片库（将来使用Bootstrap）。我知道有一些有用的库用于此目的（如序言，图像工具包等），但我很有意愿从一开始就理解所有内容。这就是为什么我只想使用Django。

由于我的所有努力，我得到以下内容（获取照片和名字而非照片）：

现在我有下一个：

settings.py

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

models.py

class GalleryCupsModel(models.Model):
    photo = models.ImageField(upload_to='cups/%Y/%m/%d')

admin.py

class GalleryCupsAdmin(admin.ModelAdmin):
    list_display = ['photo']

admin.site.register(GalleryCupsModel, GalleryCupsAdmin)

我还通过管理面板上传了3张图片（file1，file2，file3，你可以在第一张图中看到这些图片）。

view.py

def cups(request):
    context = {
        'context_cups': GalleryCupsModel.objects.all()
    }

    return render(request, 'cups.html', context)

url.py

urlpatterns = [
    url(r"^cups/all/$", "gallery_cups.views.cups", name="cups"),
]

if settings.DEBUG:
    urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

cups.html

...
{% for cup in context_cups %}
   {{ cup.photo }}
{% endfor %}
...

这是我的文件夹树：

├── gallery_cups
│   ├── migrations
│   │   └── __pycache__
│   └── __pycache__
├── LC
│   └── __pycache__
├── static_in_dev
│   ├── media
│   ├── media_root
│   ├── my_static
│   │   ├── css
│   │   ├── img
│   │   └── js
│   └── static_root
│       ├── admin
│       │   ├── css
│       │   ├── fonts
│       │   ├── img
│       │   │   └── gis
│       │   └── js
│       │       ├── admin
│       │       └── vendor
│       │           ├── jquery
│       │           └── xregexp
│       ├── css
│       ├── img
│       │   ├── header
│       │   └── portfolio
│       └── js
└── templates

问题是我得到的结果可以在第一张图中看到，而不是获得真实的照片。看起来我想念smth非常关键。我无法得到我错过的东西。

P.S。此外，我没有在static_in_dev / media / cups中看到在管理面板中上传的文件。看起来我没有充分了解MEDIA是如何运作的。

P.P.S。也许我所有的努力都只是一个猴子的工作？）使用现有的库是学习Django的更好选择吗？

Answer 1

要将ImageField呈现到模板中，您需要：

<img src="{{ cup.photo }}" />

Answer 2

嗯，一切都非常简单。你必须使用for循环包装<img src="{{ cup.photo.url }}" />，而不是divs＆＃39;同样。见下文：

<div class="container-float">
    <div class="row">
        {% for cup in context_cups %}
        <div id="image-{{cup.id}}" class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
            <img src="{{ cup.photo.url }}" />
        </div>
        {% endfor %}
     </div>
</div>