Добавление активного класса к текущему ползунку с помощью {% для%}

Question

Я настраиваю собственный слайдер в Opencart 3, основываясь на карусели Bootstrap по умолчанию.

В моем файле slider.twig у меня есть следующее:

    {% for banner in banners %}
    <div class="item active">
      <img src="{{ banner.image }}" alt="{{ banner.title }}" />
      <div class="carousel-caption post_carousel_caption">
        <h1 data-animation="animated fadeInLeft">post page carousel</h1>
        <h2 data-animation="animated fadeInRight">with beautiful animation</h2>
      </div>
    </div>
    {% endfor %}

Затем добавляется «активныйкласс для каждого слайда, и, очевидно, слайдер не работает.Как я могу добавить «активный» класс ТОЛЬКО к текущему слайду в этом случае?

Большое спасибо

Answer 1

Добавить active класс к первому слайду

{% for key, banner in banners %}
    <div class="item {{ (key == 0)?'active' }}">
      <img src="{{ banner.image }}" alt="{{ banner.title }}" />
      <div class="carousel-caption post_carousel_caption">
        <h1 data-animation="animated fadeInLeft">post page carousel</h1>
        <h2 data-animation="animated fadeInRight">with beautiful animation</h2>
      </div>
    </div>
{% endfor %}