变色龙模板引擎：带索引的循环

Question

我正在使用 Bootstrap 练习 Chameleon 模板引擎。我目前使用的布局是 Fluid layout.

在此布局的列表部分，其使用结构如下

<div class="row-fluid">
    <div class="span4">******</div>
    <div class="span4">******</div>
    <div class="span4">******</div>
</div>
<div class="row-fluid">
    <div class="span4">******</div>
    <div class="span4">******</div>
    <div class="span4">******</div>
</div>

每个 row-fluid div 恰好包含 3 span4 div.

tal:repeat in Chameleon 重复列表中的所有元素。如果列表中有 6 个元素，它会生成

<div class="row-fluid">
    <div class="span4">******</div>
    <div class="span4">******</div>
    <div class="span4">******</div>
    <div class="span4">******</div>
    <div class="span4">******</div>
    <div class="span4">******</div>
    <div class="span4">******</div>
</div>

然而，这破坏了之前的布局。

有没有办法只用Chameleon做任务？

Answer 1

问题基本上归结为 splitting a list into evenly-sized chunks 然后使用两个嵌套循环遍历 "master" 列表及其 "sublists".

完全未经测试，我认为类似以下内容是一个很好的起点：

<div class="row-fluid" tal:repeat="chunk [l[i*3:(i*3)+3] for i in range((len(l) // 3) + 1) ]">
    <div class="span4" tal:repeat="item chunk"><tal:item replace="item" /></div>
</div>

变色龙模板引擎：带索引的循环

Chameleon template engine: loop with index

python

css

twitter-bootstrap

pyramid

chameleon