0

我正在尝试使用玉做古老的画廊循环计数器（我是新手）。我正在使用 twitter 引导程序，因此我需要将图像放入 div 中，其中 col-md-3 作为一个类，并作为一个带有行的 div 的子级“。所以，理想情况下它看起来像这样：

<div class="row">
    <div class="col-md-3">image goes here</div>
    <div class="col-md-3">image goes here</div>
    <div class="col-md-3">image goes here</div>
    <div class="col-md-3">image goes here</div>
</div>
<div class="row">
    <div class="col-md-3">image goes here</div>
    <div class="col-md-3">image goes here</div>
    <div class="col-md-3">image goes here</div>
    <div class="col-md-3">image goes here</div>
</div>

我被困的地方是如何初始化新行，因为缩进在翡翠中很重要。以下是我开始的内容，我该如何进行？

div.row
    each product, index in collection.products
        div.col-md-3: img

我假设你会使用类似的东西：

if index % 3
    div.row

……但感觉不太对劲……

4

1 回答 1

0

解决了它朝不同的方向发展。我在views.py 文件的顶部创建了一个context_processor ，它可以作为一个函数在我的模板中使用。

视图.py

@app.context_processor
def utility_processor():
    def subdivide_list(list_to_group, group_size):
        return [list_to_group[i:i+group_size] for i  in range(0, len(list_to_group), group_size)]
return dict(subdivide_list=subdivide_list)

画廊.jade

div.col-md-9
    for product_row in subdivide_list(all_products, 4)
        div.row
            for product in product_row
                img(src="{{ url_for('static', filename='uploads/images/products/'+product.image.name_thumb) }}")
于 2014-12-20T06:36:26.660 回答