Question

我有一个可变的城市名称列表，我希望将其平均分成4列。我有一些解决方案，但它看起来不堪重负和肮脏。什么是最好最简单的方法？

我的解决方案在这里：

{% set cities_in_column = cities|length/4|int %}
{% set step=0 %}
<div class="four columns">
    {% for city in cities|sort %}
        {% if step > cities_in_column %}
            {% set step = 0 %}
            </div>
            <div class="four columns">
        {% endif %}
        <h5><a href="/city/{{ city.url }}">{{ city.name }}</a> <span style="float:right;">({{ city.users_count }})</span></h5>
        {% set step=step + 1 %}
    {% endfor %}
</div>

Answer 1

您正在寻找slices过滤器：

{% for column in cities | sort | slice(4) -%}
<div class="four columns">
    {%- for city in column -%}
    <h5><a href="/city/{{ city.url}}">{{ city.name }}</a>
    <span style="float:right;">({{ city.users_count }})</span></h5>
    {%- endfor -%}
</div>
{%- endfor %}

还有一个名为slices的batch的补充，提供n的运行（而不是将迭代分成n组）。

Answer 2

这是CSS *的工作：

<ol style="column-count: 4;">
{% for city in cities|sort %}
    <li>
        <a href="/city/{{ city.url }}">{{ city.name }}</a> ({{ city.users_count }})
    </li>
{% endfor %}
</ol>

（*是column-count，float，flex等。）

在Jinja2模板中将项目均匀分成列

2 个答案: