54

假设我有一个这样的 for 循环：

{% for elem in arrMenu %}
    <div class="topmenu-button">
        <a href="{{ elem.url }}">{{ elem.name }}</a>
    </div>
{% endfor %}

在这种形式下，它将呈现如下内容：

<div class="topmenu-button"><a href="url">name</a></div>
<div class="topmenu-button"><a href="url">name</a></div>
<div class="topmenu-button"><a href="url">name</a></div>
<div class="topmenu-button"><a href="url">name</a></div>

树枝如何帮助我在 div 中添加第一个和最后一个类，以便我得到如下结果：

<div class="topmenu-button first"><a href="url">name</a></div>
<div class="topmenu-button"><a href="url">name</a></div>
<div class="topmenu-button"><a href="url">name</a></div>
<div class="topmenu-button last"><a href="url">name</a></div>
4

4 回答 4

127

您可以使用“特殊变量”loop.first和loop.last您想要的。

关联

{% for elem in arrMenu %}
    {% if loop.first %}
    <div class="topmenu-button first">        
    {% elseif loop.last %}
    <div class="topmenu-button last">        
    {% else %}
    <div class="topmenu-button">        
    {% endif %}
        <a href="{{ elem.url }}">{{ elem.name }}</a>
    </div>
{% endfor %}

编辑：根据您对“一个案例”的关心程度，您可能需要这样的解决方案。

{% for elem in arrMenu %}
    {% set classes = ["topmenu-button"] %}
    {% if loop.first %}{% set classes = classes|merge(["first"]) %}{% endif %}
    {% if loop.last %}{% set classes = classes|merge(["last"]) %}{% endif %}
    <div class="{{ classes|join(" ") }}">        
        <a href="{{ elem.url }}">{{ elem.name }}</a>
    </div>
{% endfor %}
于 2011-10-20T14:38:36.990 回答
10

由于循环不能first同时last存在，我宁愿不使用elseif和编写（DRY - 如果您topmenu-button将来必须更改怎么办？）：

{% for elem in arrMenu %}
    {% set append %}
        {% if loop.first %}first{% endif %}
        {% if loop.last %}last{% endif %}
    {% endset %}
    <div class="topmenu-button {{ append }}">
        <a href="{{ elem.url }}">{{ elem.name }}</a>
    </div>
{% endfor %}

或更简洁：

{% for elem in arrMenu %}
    <div class="topmenu-button {% if loop.first %}first{% endif %} {% if loop.last %}last{% endif %}">
        <a href="{{ elem.url }}">{{ elem.name }}</a>
    </div>
{% endfor %}

编辑：这样你会在class属性中得到一些额外的空格（顺便说一句，这很好）。 Edit2：这不会处理 1 元素数组（第一个 = 最后一个）

于 2011-10-20T20:36:53.147 回答
4

如果是管理标签的类属性，三元条件会更好。

<span class="topmenu-button {{ (loop.first) ? 'first' : '' }}">{{ item.text }}</span>
于 2016-12-06T10:12:21.167 回答
0

我在 Drupal 8 视图模板中使用它。感谢'elseif'，如果你只有一个项目，那么第一个项目永远不会得到'最后一个'类：

{% for row in rows %}
    {% set parity = cycle(['odd', 'even'], loop.index0) %}
    {% set row_classes = [ default_row_class ? 'views-row', ] %}    

    <div class="views-prerow {{parity}}{% if loop.first %} first{% elseif loop.last %} last{% endif %}">
        <div{{ row.attributes.addClass(row_classes) }}>
            {{ row.content }}
        </div>
    </div>
{% endfor %}
于 2018-03-01T14:30:44.473 回答