Twig, добавьте первый и последний класс
Скажем, у меня есть цикл 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>
Ответы
Ответ 1
Вы можете использовать "специальные переменные" 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 %}
EDIT: в зависимости от того, насколько вы заботитесь о "одном случае", вам может понадобиться такое решение.
{% 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 %}
Ответ 2
Поскольку цикл не может быть 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-элементный массив (first = last)
Ответ 3
Если для управления атрибутом класса тега, тройное условие будет лучше.
<span class="topmenu-button {{ (loop.first) ? 'first' : '' }}">{{ item.text }}</span>