通过 flask 渲染模板到 html 文件的文本格式不正确

Question

I am trying to pass lyrics to the html file through flask but it is not formatting properly.我正在尝试通过 flask 将歌词传递给 html 文件，但格式不正确。

This is how I want it formatted, and I am passing it in the text variable in the same format - The value of the text variable这就是我希望它的格式，并且我以相同的格式将它传递到文本变量中 -文本变量的值

This is how it is showing in the html website - The actual result这就是它在 html 网站上的显示方式 -实际结果

How do I get it formatted properly on the website as it is already passed in a formatted way.我如何在网站上正确格式化它，因为它已经以格式化的方式传递。

This is the python code -这是 python 代码 -

import flask
import subprocess
import sys
import generate_unconditional_samples as model

app = flask.Flask(__name__, template_folder='templates')

@app.route('/', methods=['GET', 'POST'])
def main():
if flask.request.method == 'GET':
    return(flask.render_template('main.html'))

if flask.request.method == 'POST':
    text =  model.sample_model("Lyric", None, 0, 1, None, 0.8, 40, 0.0)  
    print(text)
    return flask.render_template('main.html', result = text,)
    

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

And This is the HTML code -这是 HTML 代码 -

<!doctype html>

<html>
<style>

form {
    margin: auto;
    width: 35%;
 }

.result {
    margin: auto;
    width: 100%;
    border: 1px solid #ccc;
 }

 </style>
 <head>
 <title>Lyric Generator</title>
 </head>
 <body>

 <form action="{{ url_for('main') }}" method="POST">
    <fieldset>
       <input type="submit">
    </fieldset>
 </form>

 <div class="result" align="center">
     {% if result %}
         <br> Generated Lyrics:
         <p style="font-size:20px">{{ result }}</p>
     {% endif %}
 </div>
 <body>
 </html>

Answer 1

I got the answer, just had to use the white-space: pre-line to spilt the lines我得到了答案，只需要使用 white-space: pre-line 来溢出线条

.result {
margin: center
width: 100%;
white-space: pre-line;
border: 1px solid #ccc;
}

The Final Result最终结果

通过 flask 渲染模板到 html 文件的文本格式不正确

问题描述

1 个解决方案

解决方案1
1 已采纳 2020-07-27 07:41:47

通过 flask 渲染模板到 html 文件的文本格式不正确

问题描述

1 个解决方案

解决方案1 1 已采纳 2020-07-27 07:41:47

解决方案1
1 已采纳 2020-07-27 07:41:47