python web框架fastapi模板渲染--Jinja2使用技巧总结

news2025/7/4 23:35:12

文章目录

  • 1.jinja2模板
    • 1.1、jinja2 的变量
      • 1.1.1 列表类型数据渲染
      • 1.1.2 字典类型数据渲染
  • 2. jinja2 的过滤器
  • 3. jinja2 的控制结构
    • 3.1、分支控制
    • 3.2、循环控制

1.jinja2模板

要了解jinja2,那么需要先理解模板的概念。模板在Python的web开发中⼴泛使⽤,它能够有效的将业务逻辑和页⾯逻辑分开,使代码可读性增强、并且更加容易理解和维护。
模板简单来说就是⼀个其中包涵占位变量表⽰动态的部分的⽂件,模板⽂件在经过动态赋值后,返回给⽤户。

jinja2是Flask作者开发的⼀个模板系统,起初是仿django模板的⼀个模板引擎,也可以为fastapi提供模板⽀持,由于其灵活,快速和安全等优点被⼴泛使⽤。
jinja2模板主要用在前后端不分离项目中

在jinja2中,存在三种语法:

1、控制结构 {% %}
2、变量取值 {{ }}
3、注释 {# #}

1.1、jinja2 的变量

#导入模板的包,需要单独安装:Jinja2
在这里插入图片描述

案例代码:

from fastapi import Request

from fastapi import FastAPI

import uvicorn

#导入模板的包
from fastapi.templating import Jinja2Templates
app = FastAPI()

# 实例化Jinja2对象,并将文件夹路径设置为以templates命名的文件夹
templates = Jinja2Templates(directory="templates")



@app.get("/index")
async def items(request: Request):
    name = 'root'
    return templates.TemplateResponse(
        'index.html', #第一个参数放模板文件
        {
            'request': request,  # 注意,返回模板响应时,必须有request键值对,且值为Request请求对象
            'user':name
        }, #context上下文对象,是个字典


    )


if __name__ == '__main__':
    #注意,run的第一个参数 必须是文件名:应用程序名
    uvicorn.run("模板:app", port=8080,  reload=True)

在docs运行测试,拿到了页面,并且name的值,就是我们动态传的root
在这里插入图片描述

我们用浏览器去测试接口
返回的就是个html页面
在这里插入图片描述

此时,我们就可以扩展我们得html页面
在这里插入图片描述

在模板处添加进去数据
在这里插入图片描述

浏览器访问
在这里插入图片描述

1.1.1 列表类型数据渲染

return templates.TemplateResponse(
‘index.html’, #第一个参数放模板文件
{
‘request’: request, # 注意,返回模板响应时,必须有request键值对,且值为Request请求对象
‘user’:name,
‘age’:age,
‘people’:people,
“books”: [“西游记”, “红楼梦”, “天涯”, “国色天香”],
}, #context上下文对象,是个字典

)

在html页面展示

<p>{{ books.0 }}</p>
<p>{{ books.1 }}</p>
<p>{{ books.2 }}</p>
<p>{{ books.3 }}</p>

在这里插入图片描述

浏览器查看
在这里插入图片描述

当然也可以在html中通过for循环来遍历展示

<ul>
    {% for book in books %}
    <li>{{ book }}</li>  <!--凡是变量都要用两个大括号括起来-->
{% endfor %}
</ul>

1.1.2 字典类型数据渲染

return templates.TemplateResponse(
‘index.html’, #第一个参数放模板文件
{
‘request’: request, # 注意,返回模板响应时,必须有request键值对,且值为Request请求对象
‘user’:name,
‘age’:age,
‘people’:people,
“books”: [“西游记”, “红楼梦”, “天涯”, “国色天香”],
“booksDict”: {
“西游记”: {“price”: 100, “publish”: “苹果出版社”},
“红楼梦”: {“price”: 200, “publish”: “橘子出版社”},
}
}, #context上下文对象,是个字典

)

在这里插入图片描述

在html页面通过点的方式获取

<p>{{ booksDict.金瓶梅.publish }}</p>

在这里插入图片描述

浏览器查看
在这里插入图片描述

2. jinja2 的过滤器

变量可以通过“过滤器”进⾏修改,过滤器可以理解为是jinja2⾥⾯的内置函数和字符串处理函数。常⽤的过滤器有:
在这里插入图片描述

那么如何使⽤这些过滤器呢?只需要在html文件中的变量后⾯使⽤管道(|)分割,多个过滤器可以链式调⽤,前⼀个过滤器的输出会作为后⼀个过滤器的输⼊。
{{user | capitalize }} 首字母大写

{{ ‘abc’| upper }} # ABC

{{ ‘hello world’| title }} # Hello World

{{ “hello world”| replace(‘world’,‘yuan’) | upper }} # HELLO YUAN

{{ 18.18 | round | int }} # 18

在这里插入图片描述

在这里插入图片描述

3. jinja2 的控制结构

3.1、分支控制

jinja2中的if语句类似与Python的if语句,它也具有单分⽀,多分⽀等多种结构,不同的是,条件语句不需要使⽤冒号结尾,而结束控制语句,需要使⽤endif关键字

在数据区,我们的age是18
在这里插入图片描述

在html展示区,可以使用分支控制语句来动态展示

{% if age > 18 %}

    <p>成年区</p>

{% else %}

    <p>未成年区</p>

{% endif %}

由于age=18,所以展示 未成年区 这个p标签
在这里插入图片描述

3.2、循环控制

jinja2中的for循环⽤于迭代Python的数据类型,包括列表,元组和字典。在jinja2中不存在while循环。

{% for book in books %}
    <p>{{ book }}</p>
{% endfor %}

在这里插入图片描述
在这里插入图片描述

当然,分支控制语句和循环控制语句可以嵌套使用,也不难,感兴趣的小伙伴可以试一下

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1477230.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Python多线程编程:深入理解threading模块及代码实战【第99篇—Multiprocessing模块】

Python多线程编程&#xff1a;深入理解threading模块及代码实战 在Python编程中&#xff0c;多线程是一种常用的并发编程方式&#xff0c;它可以有效地提高程序的执行效率&#xff0c;特别是在处理I/O密集型任务时。Python提供了threading模块&#xff0c;使得多线程编程变得相…

springboot 注解属性转换字典

1.注解相关功能实现 定义属性注解 import com.fasterxml.jackson.annotation.JacksonAnnotationsInside; import com.fasterxml.jackson.databind.annotation.JsonSerialize; import com.vehicle.manager.core.serializer.DicSerializer;import java.lang.annotation.*;/*** a…

图神经网络实战——图论

图神经网络实战——图论 0. 前言1. 图属性1.1 有向图和无向图1.2 加权图与非加权图1.3 连通图非连通图1.4 其它图类型 2. 图概念2.1 基本对象2.2 图的度量指标2.2 邻接矩阵表示法 3. 图算法3.1 广度优先搜索3.2 深度优先搜索 小结系列链接 0. 前言 图论 (Graph theory) 是数学…

【深度学习:标记数据】为医生标记数据缓解疼痛

【深度学习&#xff1a;标记数据】为医生标记数据缓解疼痛 问题实验结果结论 我开始在物理学方面进行学术研究&#xff0c;但在第一年就退学了&#xff08;抱歉&#xff0c;休学了&#xff09;我的博士学位&#xff0c;并在定量金融领域做了很长一段时间。因此&#xff0c;在我…

从0到1实现五子棋游戏!!

Hello&#xff0c;好久不见宝子们&#xff0c;今天来给大家更一个五子棋的程序~ 我们今天要讲的内容如下&#xff1a; 文章目录 1.五子棋游戏介绍1.1 游戏玩法介绍&#xff1a; 2.准备工作2.1 具体操作流程 3.游戏程序主函数4.初始化棋盘4.1.定义宏变量4.2 初始化棋盘 5.打印…

git的使用 -- 代码托管平台阿里云

准备工作&#xff1a;git下载&#xff0c;环境配置git config --global user.name/user.email &#xff08;这个是注解不用加&#xff0c;这里是两行命令&#xff0c;前面相同/前后各是一个&#xff09; 注册一个网站码云、阿里云等等创建远程仓库配置SSH公钥 生成公钥 ssh-ke…

流程图怎么画?只需这几步就可以搞定!

你在工作中有没有遇到过下面这些问题&#xff1a; 思维混乱&#xff0c;想快速厘清一个项目的逻辑&#xff1b; 想让客户轻松接受自己的设计构思/产品理念等&#xff1b; 产品流程总是百密一疏&#xff0c;经常遗漏了某种用户需求&#xff1b; 想让小伙伴们快速理解一件事&…

2019年下半年教师资格证考试《综合素质》(中学)题

2.吴老师在指导青年教师时说道&#xff1a;“我们是生物老师&#xff0c;自己就知道生物的多样性和保护这种多样性的重要&#xff0c;所以对各有所长的学生&#xff0c;我们可不能做一个把学生修剪得整整齐齐的园丁。”这种说法表明教师劳动具有&#xff08; C&#xff09;。 A…

JavaScript 基础学习笔记(五):函数、作用域、匿名函数

目录 一、函数 1.1 声明和调用 1.2 形参和实参 1.3 返回值 二、作用域 2.1 全局作用域 2.2 局部作用域 三、匿名函数 3.1 函数表达式 3.2 立即执行函数 一、函数 理解函数的封装特性&#xff0c;掌握函数的语法规则 1.1 声明和调用 函数可以把具有相同或相似逻辑的代…

女性力量崛起,三八妇女节5大品牌创意案例!

随着女性意识的觉醒&#xff0c;越来越多的女性正在看见、勇敢表达自己&#xff0c;并努力提升自己、且坚定地爱自己&#xff01; 从近些年的三八妇女节主题活动中&#xff0c;我们能看到越来越多的品牌都在策划品牌、产品活动时&#xff0c;越来越注重聚焦女性成长、性别议题…

Shopify如何调取开放接口实现页面更新

Shopify提供了开放接口&#xff08;API&#xff09;&#xff0c;使开发人员能够通过编程方式与Shopify平台进行交互&#xff0c;并实现页面的更新。通过调用API&#xff0c;您可以获取和更新商店的数据&#xff0c;包括产品、订单、顾客信息等。下面是使用Shopify开放接口实现页…

【GB28181】wvp-GB28181-pro修改分屏监控为16画面(前端)

引言 作为一个非前端开发人员,自己摸索起来比较费劲,也浪费了很多时间 由于实际开发中,可能预览的画面多于8个,而wvp目前只支持8画面 本文快速帮助开发者修改分屏监控为多画面。例如16画面,20画面等 文章目录 一、 预期效果展示16分割画面20分割画面二、 源码修改-前端修改…

CV论文--2024.2.28

source:CV论文--2024.2.28 1、StreamDiffusion: A Pipeline-level Solution for Real-time Interactive Generation 中文标题&#xff1a;StreamDiffusion: 一个用于实时交互生成的管道级解决方案 简介&#xff1a;我们介绍了StreamDiffusion&#xff0c;这是专为实时交互式图…

windows IIS 申请和配置https(SSL)的工具 win-acme

win-acme 是一个为Windows平台设计的工具&#xff0c;用于从Lets Encrypt自动获取和续期SSL/TLS证书&#xff0c;特别适合用于IIS&#xff08;Internet Information Services&#xff09;服务器。它的使用相对简单&#xff0c;提供了一个用户友好的命令行界面&#xff0c;以及一…

微服务API网关---APISIX

最近在做微服务调研&#xff0c;看到了apisix这个网关&#xff0c;于是进行了初步了解一下。 微服务是指&#xff0c;将大型应用分解成多个独立的组件&#xff0c;其中每个组件都各自的负责对应项目。 系统的架构大致经历了&#xff1a;单体应用架构–> SOA架构 -->微服务…

5G提速工业物联网发展

对于普通消费者来说&#xff0c;5G的概念可能就是更快的网速&#xff0c;5G带来的上网体验提升是最直观的&#xff0c;因为拿手机可以实时观看高清晰度的视频&#xff0c;且无需太久的等待时间。 而更低的时延与更高的可靠性对C端用户带来的体验改善&#xff0c;相对来说就小很…

文献阅读:Large Language Models are Null-Shot Learners

文献阅读&#xff1a;Large Language Models are Null-Shot Learners 1. 文章简介2. 方法介绍3. 实验考察 & 结论 1. 基础实验 1. 实验设计2. 实验结果 2. 消融实验 1. 小模型上的有效性2. ∅CoT Prompting3. 位置影响4. 组成内容 4. 总结 & 思考 文献链接&#xff1…

langchain加载模型时出现ConnectionError: (ProtocolError(‘Connection aborted.‘的解决方案

大家好,我是爱编程的喵喵。双985硕士毕业,现担任全栈工程师一职,热衷于将数据思维应用到工作与生活中。从事机器学习以及相关的前后端开发工作。曾在阿里云、科大讯飞、CCF等比赛获得多次Top名次。现为CSDN博客专家、人工智能领域优质创作者。喜欢通过博客创作的方式对所学的…

瑞_23种设计模式_组合模式

文章目录 1 组合模式&#xff08;Composite Pattern&#xff09;1.1 介绍1.2 概述1.3 组合模式的结构1.4 组合模式的分类1.5 组合模式的优点1.6 组合模式的使用场景 2 案例一2.1 需求2.2 代码实现 3 案例二3.1 需求3.2 代码实现 &#x1f64a; 前言&#xff1a;本文章为瑞_系列…

基于java+springboot景区行李寄存管理系统设计和实现

基于javaspringboot景区行李寄存管理系统设计和实现 博主介绍&#xff1a;多年java开发经验&#xff0c;专注Java开发、定制、远程、文档编写指导等,csdn特邀作者、专注于Java技术领域 作者主页 央顺技术团队 Java毕设项目精品实战案例《1000套》 欢迎点赞 收藏 ⭐留言 文末获取…