2

我想每行显示 2 个缩略图。仅使用多行对其进行硬编码并且每行有 2 个span6div 将非常简单。但是我如何在 Django 中使用模板 for-loop 做到这一点？

例子：

{% for image in images %}
  <div class="row">
    <div class="span6">*image goes here*</div>
    <div class="span6">*image goes here*</div>
  </div>
{% endfor %}

// repeat for all items in the list, with 2 images per row

因此，在上面的代码中，span6应该在每次循环迭代中创建，但row应该只在每 2 次迭代中创建。

更新：我能够span6在一行中跨越所有元素。我遇到了缩略图无法正确对齐的问题（行之间的空白）。将所有缩略图设置为统一高度解决了这个问题。但是 Hedde 的解决方案看起来也很不错，尽管这涉及在 Python 方面进行更改。

4

2 回答 2

12

好吧，它只能由 css 完成，但如果你想使用提供的网格，你可以创建一个生成器并在视图的查询集上使用它，或者通过使用标签直接在模板中使用它，例如

def grouped(l, n):
    # Yield successive n-sized chunks from l.
    for i in xrange(0, len(l), n):
        yield l[i:i+n]

模板标签

@register.filter
def group_by(value, arg):
    return grouped(value, arg)

模板

{% for group in objects|group_by:2 %}
    <div class="row">
        {% for obj in group %}
            <div class="span6">
                foo
            </div>
        {% endfor %}
    </div>
{% endfor %}
于 2013-05-08T21:18:03.317 回答
3

这是另一种无需向 Python 代码添加模板逻辑的方法。您确实需要确保列表中有偶数个项目，否则循环将无法正常关闭。

{% for image in images %}
  {% cycle "<div class='row'>" "" %}
    <div class="span6">*image goes here*</div>
  {% cycle "" "</div>" %}
{% endfor %}

您可以通过在循环模板标签中添加额外的空白来使其适用于更多列。如果有人能想到一个简单的方法来在列表中有奇数个项目时关闭循环，我很想听听！

于 2013-12-08T04:59:32.837 回答