Как исправить проблему с изображением веб-сайта на HTML

{% extends 'base.html' %}

{% block content %}
    <hi>Products</hi>
    <div class="row">
        {% for products in products %}
         <div class="col">
            <div class="card" style="width: 70rem;">
                <img src="{{ products.image_url }}" class="card-img-top" alt="...">
                <div class="card-body">
                    <h5 class="card-title">{{ products.name }}</h5>
                    <p class="card-text">${{ products.price }}</p>
                    <a href="#" class="btn btn-primary">Add to Cart</a>
                </div>
            </div>
        </div>
        {% endfor %}
    </div>
{% endblock %}

Есть ли проблема с этим кодом

Я попробовал переформатировать код, заменив products.url в скобках alt. Но отобразилось только то, что я набрал в скобках. Пожалуйста, помогите мне. Я расстроен. Мне 13 лет, я начинающий программист. Это мой первый сайт, который я перезапускал около 19 раз из-за этой проблемы. Помогите мне

Я не совсем понимаю, в чем ваша проблема, но я вижу проблему в коде, попробуйте заменить:

{% for products in products %}

to

{% for single_product in products %}

и затем обновите эти строки новым именем переменной single_product

<img src="{{ single_product.image_url }}" class="card-img-top" alt="...">
<h5 class="card-title">{{ single_product.name }}</h5>
<p class="card-text">${{ single_product.price }}</p>

Используя то же имя переменной, вы переопределяете ее

Вернуться на верх