django - python - Django显示使用外键上传的多张图片

Question

例如，我有一个 ID 为 的帖子31 在我上传一张或多张图片后，db 中显示为:

id(例如:1,2,3)

图片的url(例如:my-images/image.png)

foreing_id(这是要发布的 ID，即 31 )

但我不知道如何在这篇文章的模板中显示图像(当然还有其他人)

我的模型:

class Post(models.Model):
    title = models.CharField(max_length=20000)
    date = models.DateTimeField(editable=True, null=True)
    text = models.TextField(max_length=50000)
    is_super = models.IntegerField(default=0)

class Image(models.Model):
    foreing = models.ForeignKey(Post)
    image = models.ImageField(null=True, blank=True, upload_to='my-images')

查看我上传和显示所有帖子的位置(我在这里显示):

class IndexView(generic.ListView):
    paginate_by = 4
    template_name = 'home/index.html'
    context_object_name = 'all_posts'

    def get_queryset(self):
        query = self.request.GET.get('q')
        if query:
            posts = Post.objects.filter(
                Q(text__icontains=query.capitalize()) |
                Q(title__icontains=query.capitalize()) |
                Q(text__icontains=query.lower()) |
                Q(title__icontains=query.lower())
            ).distinct()
            return posts
        else:
            return Post.objects.filter(date__lte=timezone.now()).order_by('-date')

在那里我创建了一个新帖子:

def post_new(request):
    ImageFormSet = modelformset_factory(Image, form=ImageForm, extra=3)
    if request.method == "POST":
        form = PostForm(request.POST, request.FILES or None)
        formset = ImageFormSet(request.POST, request.FILES, queryset=Image.objects.none())
        if form.is_valid() and formset.is_valid():
            post = form.save(commit=False)
            post.date = timezone.now()
            post.save()
            for form in formset.cleaned_data:
                image = form['image']
                photo = Image(foreing_id=post.id, image=image)
                photo.save()
            return render(request, 'home/page.html')
        else:
            form = PostForm()
        return render(request, 'home/edit_post.html',
                  {'form': form, 'error_message': 'something error message'})
    else:
        form = PostForm()
        formset = ImageFormSet(queryset=Image.objects.none())
    return render(request, 'home/edit_post.html', {'form': form, 'formset': formset})

在这里我需要显示所有这些帖子的图像:

这是显示的图像

        <div class="profile-img-container" style="text-align: center">
            <img class="img" src="images">
            <a target="_blank" title="****." href="URL to the uploaded image"><span class="fa fa-expand fa-5x" style="color: darkcyan" aria-hidden="true"></span></a>

如果需要，完整的 index.html:

<div class="content">
{% for post in all_posts %}
    <div class="thumbnail">
        <p style="text-align: center">{{ post.title }}</p>
            <p class="text" style="text-align: center; height: 40px; overflow: hidden">{{ post.text }}</p>
                <p><a type="button" class="btn btn-primary" href="{% url 'klass:detail' post.id %}">More...</a></p>
            <div class="profile-img-container" style="text-align: center">
                <img class="img" src="/media/**display images**" style="height: 150px">
                <a target="_blank" title="****." href="**url to images**"><span class="fa fa-expand fa-5x" style="color: darkcyan" aria-hidden="true"></span></a>
            </div>
            {% if user.is_authenticated %}
                <form method="post" style="text-align: right">
                <p>
                    {% csrf_token %}
                    <a methods="post" role="button" class="btn btn-info" href="{% url 'klass:favorite' post.id %}">
                        <i class="fa fa-heart" style="color: red" aria-hidden="true"></i>great! {{ post.is_super }}
                    </a>
                </p>
                </form>
                <span style="margin-left: 90px">Published: {{ post.date }}</span>
            {% else %}
                <p style="text-align: right">****<br>
                <a role="button" class="btn btn-info disabled" style="text-align: right">
                <i class="fa fa-heart" aria-hidden="true"></i>great!</a>
                {{ post.date }}
                </p>
            {% endif %}
    </div>
{% endfor %}

编辑

网址:

from django.conf.urls import url, include
from django.contrib import admin
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^home_page/', include('home.urls', namespace='home')),
    url(r'^captcha/', include('captcha.urls')),
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

设置:

STATIC_URL = '/static/'

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'home/static'),
]

MEDIA_URL = '/media/'

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

家庭应用中的另一个网址:

from django.conf.urls import url
from . import views

app_name = 'home'

urlpatterns = [
    ***,
    url(r'^$', views.IndexView.as_view(), name='index'),
    url(r'^(?P<post_id>[0-9]+)/$', views.comments, name='detail'),
    url(r'^(?P<post_id>[0-9]+)/addcomment$', views.addcomment, name='comment'),
    url(r'^(?P<post_id>[0-9]+)/favorite/$', views.favorite, name='favorite'),
    url(r'^(?P<pk>[0-9]+)/edit/$', views.post_edit, name='edit'),
    url(r'^post/new/$', views.post_new, name='post_new'),
    url(r'^(?P<post_id>[0-9]+)/delete_album/$', views.delete_post, name='delete_post'),
    ****,
]

Answer 1

您应该遍历 post.image_set.all并分别显示每个图像，例如:

{% for image in post.image_set.all %}
<div class="profile-img-container" style="text-align: center">
  <img class="img" src="{{ image.image.url }}" style="height: 150px">
  <a target="_blank" href="{{ image.image.url }}">
    <span class="fa fa-expand fa-5x" style="color: darkcyan" aria-hidden="true"></span>
  </a>
</div>
{% endfor %}

一些旁注:

您不应该包含 /media在您的图像 url 中，因为它会被 Django 自动附加。

将您的外键命名为 foreign (还要检查您的拼写)出于可读性原因不推荐。考虑将其重命名为使用小写的父模型名称(例如 post )，使其变为 post = models.ForeignKey(Post)

使用 _id 引用外键不推荐。改用模型本身，例如:photo = Image(post=post, image=image)