Добавете div след всеки 3d елемент twig loop, модул

Здравейте, така че имам този цикъл на twig и това, което трябва да направя, е след всеки 3-ти елемент да добавя малко html, за да затворя div ред и да отворя нов.

Опитах с различни фрагменти от този уебсайт, но нямах успех с нито един от тях

<div class="row">
    {% for date, date_info in dates %}
        <div class="col-sm-4">
            <div class="event-box">
                {% for category in date_info.events %}
                    {% for event in category %}
                        <div class="event-header">
                            {% if event.get_runtime( 'content_img_url' ) is empty %}
                                {{ event | avatar( [
                                'post_thumbnail',
                                'location_avatar',
                                'category_avatar'
                                ]) | raw }}
                            {% endif %}
                            <div class="event-date">
                                {{ date | month }}
                                {{ date | day }}
                            </div>
                            <div class="event-footer">
                                <h3>{{ event.get_runtime( 'filtered_title' ) | raw }}</h3>
                                <div class="event-time">
                                    {{ event | timespan( 'short' ) | raw }}...
                                </div>
                                <div class="event-content"> {{ event.get_runtime( 'filtered_content' ) | slice(0,200) | raw }}</div>

                                <a  class="btn btn-success" href="/bg{{ event.get_runtime( 'instance_permalink' ) | e('html_attr') }}">
                                    {{ text_read_more }}
                                </a>
                            </div>
                        </div>
                    {% endfor %} {# event in category #}
                {% endfor %} {# category in date_info.events #}
            </div>
        </div>
    {% endfor %} {# date, date_info in dates #}
</div>

person Alex    schedule 01.09.2014    source източник
comment
Не виждам никакъв опит тук. Опитахте ли филтъра batch?   -  person Maerlyn    schedule 02.09.2014
comment
Въпросът ви е твърде дълъг за темата, която задавате. Моля, помислете за съкращаването му. Пълният HTML фрагмент изглежда ненужен.   -  person Boris D. Teoharov    schedule 19.10.2017


Отговори (4)


Мисля, че това е по-доброто решение:

{% for date, date_info in dates %}
   {% if loop.first %}
      <div class="row"> {# open row #}
   {% endif %}


       {# your code here #}


    {% if loop.index % 3 == 0 %}
        </div><div class="row"> {# after 3 iterates close row and open new #}
    {% endif %}                
    {% if loop.last %}
        </div> {# close last row #}
    {% endif %}
{% endfor %}
person fafii    schedule 30.07.2016
comment
Този отговор може да е добър, но можете ли да добавите обяснение за това какво прави и защо може да реши проблема с OP? - person dbmitch; 30.07.2016
comment
Кодът се обяснява сам, това е по-добър отговор. - person zeros-and-ones; 21.06.2017

Вместо това можете да използвате партиден филтър (Нов в 1.12.3).

{% for date, date_info in dates|batch(3) %}
   .....
   .....
{% endfor %}
person albertski    schedule 13.07.2016
comment
Мда! Това е невероятно и работи чудесно. Много по-полезно. - person Nacho; 30.05.2017
comment
Това е чудесно решение. - person desloovere_j; 06.07.2018

Разбрах, че работи с {% ако loop.index се дели на (3), а не loop.last %}.

Ето моят пълен пример за работен код:

<div class="row">

    {% for date, date_info in dates %}
        <div class="col-sm-4">
            <div class="event-box">
                {% for category in date_info.events %}
                    {% for event in category %}
                        <div class="event-header">
                            {% if event.get_runtime( 'content_img_url' ) is empty %}
                                {{ event | avatar( [
                                'post_thumbnail',
                                'location_avatar',
                                'category_avatar'
                                ]) | raw }}
                            {% endif %}
                            <div class="event-date">
                                {{ date | month }}
                                {{ date | day }}
                            </div>
                            <div class="event-footer">
                                <h3>{{ event.get_runtime( 'filtered_title' ) | raw }}</h3>

                                <div class="event-time">
                                    {{ event | timespan( 'short' ) | raw }}...
                                </div>
                                <div class="event-content"> {{ event.get_runtime( 'filtered_content' ) | slice(0,200) | raw }}</div>

                                <a class="btn btn-success"
                                   href="/bg{{ event.get_runtime( 'instance_permalink' ) | e('html_attr') }}">
                                    {{ text_read_more }}
                                </a>
                            </div>
                        </div>
                    {% endfor %} {# event in category #}
                {% endfor %} {# category in date_info.events #}
            </div>
        </div>

        {% if loop.index is divisibleby(3) and not loop.last %}
        </div>

        <div class="row">

        {% endif %}

    {% endfor %} {# date, date_info in dates #}

</div>
person Alex    schedule 02.09.2014
comment
Мисля, че това не е напълно правилно. Ако имате 3 елемента, това ще позволи на ‹div class=row› да се отвори. Трябва да затворите div извън цикъла и да добавите, а не loop.last в условието if, за да предотвратите това. - person progzy; 09.02.2016

При четене на този документ: http://twig.sensiolabs.org/doc/tags/for.html#the-loop-variable

Ще опитам този вид код:

{% for date, date_info in dates %}
   {% if  loop.index % 3 == 0 %}
       {# put your code to close your div #}
   {% endif %}
{% endfor %}
person BENARD Patrick    schedule 02.09.2014
comment
@benedict_w Благодаря ^^ - person BENARD Patrick; 08.10.2015