时间戳

首页 > 解决方案 > 尝试使用flask和jinja2在文件夹中显示随机图像，但当前显示的是不在文件夹中的不同文件

flask - 尝试使用flask和jinja2在文件夹中显示随机图像，但当前显示的是不在文件夹中的不同文件

问题描述

我正在尝试显示我的静态/图片文件夹中的随机图像，但这样做时正在显示的图像是不存在的图像。这是我的主要/路线页面：

from flask import Blueprint, render_template, redirect, url_for, request
from flask_paginate import Pagination, get_page_args
from app.models import User, Event, Category
import os
import random

main = Blueprint('main', __name__)

imgs = os.listdir('app/static/pics')
imgs = ['pics/' + file for file in imgs]

@main.route('/')
@main.route('/index', methods=['GET', 'POST'])
@main.route('/index/<cat>', methods=['GET', 'POST'])
def index(cat=None):
    page = int(request.args.get('page', 1))
    per_page = 6
    offset = (page - 1) * per_page
    featuredimage = random.sample(imgs, k=1)

    events = Event.query.order_by(Event.title.asc())
    categories = [cat.name for cat in Category.query.all()]
    if cat is not None:
                events = [b.events.order_by(Event.date.asc()) for b in Category.query.filter_by(name=cat)][0]

    events_for_render = events.limit(per_page).offset(offset)
    search =False
    q = request.args.get('q')
    if q:
        search=True
    pagination = Pagination(
        page=page, 
        per_page=per_page,
        offset=offset,
        total=events.count(),
        css_framework='bootstrap3',
        search=search
        )
    return render_template('index.html', events=events_for_render,
    pagination=pagination, categories=categories, title='Home', featuredimage=featuredimage)

这是我的 index.html 页面上的部分：

<body>
<div class="car-container">
        <div id="carouselExampleControlsNoTouching" class="carousel slide" data-bs-touch="false" data-bs-interval="false">
  <div class="carousel-inner">
    <div class="carousel-item active">
    
    {% for pics in featuredimage %}
        <img src="{{ url_for('static', filename='pics/{{pics}}') }}">
    {% endfor %}
    </div>

当前显示的图像是“/static/pics/%7B%7Bpics%7D%7D”，它不在我的图片文件夹中。

谢谢您的帮助。

标签： flaskjinja2

解决方案

问题是你应该正确格式化url，显示的图像"/static/pics/%7B%7Bpics%7D%7D" %7B是指{和%7D指}

试试这个，使用 Javascript 语言，这将有助于格式化 html 中的 img 元素。

for 循环：

{% for pics in featuredimage %}
<script language="JavaScript">
    document.write("<img src={{ url_for('static', filename='pics/"+{{pics}}+"') }}">
</script>
{% endfor %}

推荐阅读