Question

我想每行显示2个缩略图。使用多行对其进行硬编码并且每行有2个span6 div是非常简单的。但是我如何使用模板for-loop在Django中执行此操作？

示例：的

{% 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，但{2}只应每2次迭代创建一次。{/ p>

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

Answer 1

它可以仅通过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]

templatetags

@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 %}

Answer 2

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

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

只需在循环模板标签中添加其他空格，即可使其适用于更多列。如果列表中有奇数项目，任何人都可以想出一个简单的方法来关闭循环，我很乐意听到它！

如何使用Django在Bootstrap中显示每行span6的2个缩略图？

2 个答案: