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>

twig は、最初と最後のクラスを 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.firstloop.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 %}

編集:「1つのケース」をどれだけ気にするかによって、このような解決策が必要になる場合があります。

{% 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

ループはできませんがfirstlast同時に、使用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」に感謝します。アイテムが1つしかない場合、最初のアイテムが「最後の」クラスを取得することはありません:

{% 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 に答える