Django

Question

我正在使用 Django 框架和 bootstrap 开发一个产品站点。我想在for循环中显示图像。
我已经完成了使用 for 循环并按顺序显示图片但我想一开始只显示 20 张图片，然后使用下一个按钮加载更多 10 张图片，依此类推。
是否可以在同一页面上完成，即相同的 URL.

<div class="div1" style="max-width: wrap content; height: 50em; padding-left: 7em;">

{% for p in product.types_set.all %}

    {% if p.available == True %}


    <div class="img" align="center" style=" float: left; width: 20em; height: 25em;">

      <img class="img-thumbnail" src="{{MEDIA_URL}}{{p.image.url}}" alt="image" style="width: 15em;">

    </div>

       {% endif %}
    {% endfor %}

</div>

Answer 1

您需要使用分页。

https://docs.djangoproject.com/en/1.9/topics/pagination/

将 product.types_set.all() 对象传递给 Paginator

def listing(request):
    product = <get the product here>
    types_set_list = product.types_set.all().objects.all()
    paginator = Paginator(types_set_list, 20) # Show 20 contacts per page

    page = request.GET.get('page')
    try:
        typesets = paginator.page(page)
    except PageNotAnInteger:
        # If page is not an integer, deliver first page.
        typesets = paginator.page(1)
    except EmptyPage:
        # If page is out of range (e.g. 9999), deliver last page of results.
        typesets = paginator.page(paginator.num_pages)

    return render(request, 'list.html', {'typesets': typesets})

并在 list.html

<div class="div1" style="max-width: wrap content; height: 50em; padding-left: 7em;">

{% for p in typesets.all %} 
  {% if p.available == True %}
    <div class="img" align="center" style=" float: left; width: 20em; height: 25em;">
      <img class="img-thumbnail" src="{{MEDIA_URL}}{{p.image.url}}" alt="image" style="width: 15em;">
    </div>
  {% endif %}
{% endfor %}
</div>
<div class="pagination">
    <span class="step-links">
        {% if typesets.has_previous %}
            <a href="?page={{ typesets.previous_page_number }}">previous</a>
        {% endif %}

        <span class="current">
            Page {{ contacts.number }} of {{ typesets.paginator.num_pages }}.
        </span>

        {% if typesets.has_next %}
            <a href="?page={{ typesets.next_page_number }}">next</a>
        {% endif %}
    </span>
</div>

Django - 使用 for 循环在模板中显示图像

Django - Display images in template using for loop

python

client

image

django-templates