使用 Jinja2 模板在 HTML 文本区域中显示 FastAPI 响应（元组）答案

【问题标题】：Display FastAPI response (tuple) in an HTML textarea using Jinja2 Templates使用 Jinja2 模板在 HTML 文本区域中显示 FastAPI 响应（元组）
【发布时间】：2022-10-13 00:09:28
【问题描述】：

这是我的 FastAPI 后端：

主文件

from typing import Optional
from fastapi import FastAPI, Request, Form
from fastapi.templating import Jinja2Templates

app = FastAPI()
templates = Jinja2Templates(directory='./')

@app.get("/")
def index():
    return "Hello World"

@app.get("/item/{text}")
def get_item(text: str):
    return {"result": tuple(['Hi', 'hello'])}

@app.get("/form")
def form(request: Request):
    result = ""
    return templates.TemplateResponse('form.html', context={'request': request, 'result': result})

@app.post("/form")
def form(request: Request, text: str=Form(...)):
    
    result = ['Hello', 'Hi', 'Bye'] # to simplify the example
    return templates.TemplateResponse('form.html', context={'request': request, 'result': tuple(result)})

这是 Jinja2 模板：

表单.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Small example</title>
  </head>
  <body>
    <form method="post">
      <label for="text">Input text:</label>
      <br>
      <textarea id="text" name="text" rows="12" cols="50"></textarea>
      <br/>
      <input type="submit" value="Submit">
    </form>
    <br></br>
    <form method="post">
      <label for="text">Result:</label>
      <br>
      <textarea id="result" name="result" rows="12" cols="50"> {{ result }} </textarea>
      <br/>
    </form>
  </body>
</html>

在这里，我在文本区域中得到结果： ('Hello', 'Hi', 'Bye')。

我需要的是在结果文本区域：

Hello. 

Hi. 

Bye.

【问题讨论】：

标签： python html rest jinja2 fastapi

【解决方案1】：

您可以遍历元组：

<textarea id="result" name="result" rows="12" cols="50"> 
    {% for i in result %}
        {{ i }}
    {% endfor %}
</textarea>

您也可以在一行中键入 aobve，因为上面似乎没有将文本左对齐，除非您将整个 python 代码移到左侧。与&#13;&#10; 一起使用，如here 所述，在项目之间添加换行符。

<textarea id="result" name="result" rows="12" cols="50">{% for i in result %}{{ i }}&#13;&#10;{% endfor %}</textarea>

【讨论】：