Flask教程3:jinja2模板引擎

文章目录

模板的导入与使用
  • Flask通过render_template来实现模板的渲染,要使用这个方法,我们需要导入from flask import rander_template,模板中注释需放在{# #}

  • 模板的第一个参数为指定的模板文件名称,如自定义的html文件,第二个(及后续)参数为可选项,用于向模板中传递变量。

python 复制代码
from flask import Flask,render_template

app = Flask(__name__)

# 给前端模板传参
@app.route("/")
def index():
    data = {
        'name':'张三',
        'age':18,
        'mylist':[1,2,3,4,5,6,7]
    }
    # 以键值对的形式传参给模板index2.html
    # 左边是我们要在前端调用时使用的变量名称(形参:data);
    # 右边是我们给这个变量传的值(实参:字典data);
    return render_template('index2.html',data=data)

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

前端html模板内需要在双括号{``{ }}中使用该变量:

如果想给该变量添加属性便于CSS修改格式,我们可以在变量后添加括号,并在括号内定义class、id等属性 → \rightarrow →点击查看

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
hello world
<br>
<!-- 对传入变量的使用并显示:在双括号内,和python中用法类似 -->
{{ data }}
<br>
{{ data['name'] }}
<br>
{{ data.name }}
<br>
mylist:{{ data.mylist }}
<br>
mylist[1]:{{ data.mylist[1] }}
<br>
count:{{ data.mylist[1]+data.mylist[2] }}
</body>
</html>
相关推荐
鹿角片ljp几秒前
Engram 论文精读:用条件记忆模块重塑稀疏大模型
python·自然语言处理·nlp
Blossom.11818 分钟前
AI Agent的长期记忆革命:基于向量遗忘曲线的动态压缩系统
运维·人工智能·python·深度学习·自动化·prompt·知识图谱
努力的小陈^O^22 分钟前
问题:Spring循环依赖问题排查与解决
java·开发语言·前端
Ccjf酷儿23 分钟前
C++语言程序设计 (郑莉)第十章 泛型程序设计与C++标准模板库
开发语言·c++
企业对冲系统官29 分钟前
基差风险管理系统日志分析功能的架构与实现
大数据·网络·数据库·算法·github·动态规划
冉冰学姐31 分钟前
SSM学毕电设信息采集系统74v6w(程序+源码+数据库+调试部署+开发环境)带论文文档1万字以上,文末可获取,系统界面在最后面
数据库·学生管理·ssm 框架应用·学毕电设·信息采集系统
love530love34 分钟前
ComfyUI Hunyuan-3D-2 插件安装问题解决方案
人工智能·windows·python·3d·comfyui·hunyuan-3d-2·pygit2
茁壮成长的露露1 小时前
MongoDB备份恢复工具mongodump、mongorestore
数据库·mongodb
FreeBuf_1 小时前
利用零宽度字符的隐形JavaScript混淆工具InvisibleJS浮出水面
开发语言·javascript·ecmascript
我是一只小青蛙8881 小时前
Python Pandas 从入门到精通全指南
python