时间戳

首页 > 解决方案 > 使用for循环从python Flask应用程序以html呈现表格

javascript - 使用for循环从python Flask应用程序以html呈现表格

问题描述

我想使用 for 循环将 python 数据框显示到 html 页面中。我不想使用.to_html函数，因为我想自定义表格元素。有没有办法做到这一点？

这是我的python代码：

@app.route('/table',methods=['GET','POST'])
def table():
    url = 'https://raw.github.com/pandas-dev/pandas/master/pandas/tests/data/tips.csv'
    df_Final = pd.read_csv(url)
    df_Final_header = list(df_Final)
    df_Final_header_length1 = len(df_Final_header)
    df_Final_header_length = list(range(0,df_Final_header_length1))
    df_Final_Index_length1 =len(df_Final.index)
    df_Final_Index_length = list(range(0,df_Final_Index_length1))
    return render_template('table1.html',data=df_Final,headers=df_Final_header,data_index_len=df_Final_Index_length,data_row_len=df_Final_header_length) #.to_html(classes="table table-striped table-bordered table-hover table-condensed"))

if __name__ == '__main__':
    app.run(debug=True)

这是我的圣殿：

<html>
<head>
<style>
#customers {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

#customers td, #customers th {
    border: .5px solid #ddd;
    padding: 8px;
}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #87CEFA;
    color: white;
}
</style>
</head>
<body>
<table id="customers">
    <tr>
     {% for header in headers %}<th>{{ header }}&nbsp&nbsp</th>{% endfor %}
    </tr>
{% for i in data_index_len %}
    <tr>
        {% for j in headers %}<td>{{ data.ix[i,j] }}&nbsp&nbsp</td>
        {% endfor %}
    </tr>
{% endfor}
</table>
</body>
</html>

加载 /table 时出现此随机错误

jinja2.exceptions.TemplateSyntaxError: unexpected '}'

标签： javascriptpythonhtmlflaskjinja2

解决方案

在您的代码中 -

{% for i in data_index_len %}
    <tr>
        {% for j in headers %}<td>{{ data.ix[i,j] }}&nbsp&nbsp</td>
        {% endfor %}
    </tr>
{% endfor}  <==== you are missing a %

{% endfor %}应该解决你的错误

推荐阅读