Bootstrap轮播 - 在javascript中循环

Question

I am trying to use the bootstrap carousel, but cannot really get it to work. I have a list with pictures I want to loop through and show in the carousel. I cannot show all the pictures since the "activate" (line 3 in the text below) only should be applied for the first picture (and not for the other ones in the list). This mean that I need some kind of restriction regarding the "activate". Probably something like "only use activate for the first loop-through". I'm not quite sure how to write that. I'm writing in javascript (newbie) and having a really hard time incorporating it in the html file.

  <div class="carousel-inner">
        {% for image in images %}
          <div class="carousel-item active">
            <img src="{{ url_for('static', filename='images/' + image.image) }}" alt="{{ name }} product image" class="d-block w-100">
          </div>
        {% endfor %}
    </div>

Answer 1

You are using some template language here, I think Django.

You need to put class active in if block.

 {% if image in images is first %} active {% endif %}
 {% with %} {% endwith %}

I think you can use with syntax. This example is just logic you need to follow. Just find the correct syntax. Other you do not need to change.