Loop through Django objects to create image list in template

160 Views Asked by At

I would like to dynamically create a list of images within a div element in Django template.

Here's what I have tried:

{% for img in object.property_obj.gallery.all %}
   <div class="carousel-item">
       <img class="d-block w-100" src="{{ img.image.url }}" alt="slide">
   </div>                                                
{% endfor %}

Example: If the object has 3 images, I want 3 successions of <div class="carousel-item">

1

There are 1 best solutions below

0
On

This is what I did and it worked.

{% for kitten in available_kittens %}
<div class="flexbox-item row">
  <div class="col-xs-12 col-md-8">
    
    <div id="myCarousel{{ kitten.id }}" class="carousel slide" data-ride="carousel">
      <div class="carousel-inner">
        <div class="carousel-item active">
          <img class="carousel-image" src="{{ kitten.image1.url }}" alt="First slide">
        </div>
        {% if kitten.image2 %}
        <div class="carousel-item">
          <img class="carousel-image" src="{{ kitten.image2.url }}" alt="Second slide">
        </div>
        {% endif %}