Flask Jinja2 for循环内嵌套表达式加载图片页面的实现问题

核心错误原因 #

现有代码的问题出在img标签的src属性书写不符合Jinja2语法规范：在{{ }}包裹的表达式内部不允许再次嵌套{{ }}引用变量，你写的{{url_for('static', filename='images/{{item.img_path}}')}}属于嵌套使用模板变量标记，会导致路径解析失败，图片无法正常加载。

正确修正方案 #

把url_for的filename参数改为字符串拼接形式直接引用item.img_path变量即可，不需要再加第二层{{ }}：

{% for item in items %}
    {% include 'includes/items_modals.html' %}
        <div class="card-deck"  style="width:250px; height:350px">
        <div class="card bg-dark" style="width: 18rem; margin-top:20px">
            <!-- 仅修改src部分即可 -->
            <img src="{{url_for('static', filename='images/' ~ item.img_path)}}" class="card-img-top" alt="...">
            <div class="card-body">
                <h4 class="card-title" >{{item.name}}</h4>
                <p class="card-text" style="color:green; font-weight:bold">₦{{item.price}}</p>
                <a href="#" class="btn btn-primary">Add to Cart</a>
            </div>
        </div>
        </div>
{% endfor %}

验证说明 #

代码中~是Jinja2的字符串拼接运算符，会自动把前后内容拼接为完整的文件路径。只要你的item.img_path字段存储的是图片在static/images目录下的相对文件名（比如laptop.jpg），Flask就会自动生成正确的静态资源访问路径，图片即可正常加载。

内容的提问来源于stack exchange，提问作者MOSES NOKNAN JOHN