前言
- 之前的文章有个栗子,视图函数可以直接返回一段 html 代码,浏览器可以自动渲染
- 但是当你的 HTML 非常复杂的话,也要整串写在代码里面吗,这显然不合理的,可阅读性也非常差
- 所以,就诞生了 Jinja2 这种模板引擎来解决需要返回复杂 jinja2 模板代码的问题
简单的栗子
以下是一个 jinja2 的模板,它对登录和未登录用户显示不同的信息
<html> {% if login %} <p>你好,{{name}}</p> {% else %} <a href='/login'>登录</a> {% endif %} </html>
如果用户已经登录:变量 login 为真、变量 name 为 tom,模板被渲染成如下的 html 文件
<html>
<p>你好,tom</p>
</html>
如果用户没有登录:变量 login 为假,模板被渲染成如下的 html 文件:
<html>
<a href='/login'>登录</a>
</html>
Flask 中使用模板
目录结构
一般来说 templates 就是存放模板的目录
jinja2 模板代码
<!DOCTYPE html> <html> <body> <h2>My name is {{ name }}, I am {{ age }} years old</h2> </body> </html>
flask 代码
- 首先,需要 import render_template
- 然后,视图函数调用 render_template,对模板 templates/index.html 进行渲染
- render_template 包含有 2 个命名参数:name 和 age,模板引擎将模板 templates/index.html 中的变量进行替换
from flask import Flask, render_template app = Flask(__name__) @app.route('/') def index(): return render_template('index.html', name='tom', age=10) app.run(debug=True)
浏览器的运行效果
分界符
jinja2 模板文件混合 html 语法与 jinja2 语法,使用分界符区分 html 语法与 jinja2 语法。有 5 种常见的分界符:
- {{ 变量 }},将变量放置在 {{ 和 }} 之间;
- {% 语句 %},将语句放置在 {% 和 %} 之间;
- {# 注释 #},将注释放置在 {# 和 #} 之间;
- ## 注释,将注释放置在 # 之后
变量
语法
jinja2 模板中,使用 {{ var }} 包围的标识符称为变量,模板渲染会将其替换为 Python 中的变量,语法如下:
{{ 变量 }}
jinja2 模板
<html> {{ string }} <ul> <li> {{ list[0] }} <li> {{ list[1] }} <li> {{ list[2] }} <li> {{ list[3] }} </ul> <ul> <li> {{ dict['name'] }} <li> {{ dict['age'] }} </ul> </html>
包含有 3 种类型的变量:字符串、列表、字典,它们会被替换为同名的 Python 变量
flask 代码
from flask import Flask, render_template app = Flask(__name__) string = 'www.imooc.com' list = ['www', 123, (1, 2, 3), {"name": "poloyy"}] dict = {'name': 'zhangsan', 'age': True} @app.route('/2') def index2(): return render_template('index2.html', string=string, list=list, dict=dict) app.run(debug=True)
列表的值包含字符串、数字、元组、字典,字典的值包含字符串、布尔值
浏览器的运行效果
for 语句
语法
jinja2 模板中,使用 {% 语句 %} 包围的语法块称为语句,jinja2 支持类似于 Python 的 for 循环语句,语法如下:
{% for item in iterable %}
{% endfor %}
有些教程会说有另一种等价写法
# for item in iterable
# endfor
但我实验发现并不生效
jinja2 模板代码
<h1>Members</h1> <ul> {% for user in users %} <li>{{ user }}</li> {% endfor %} # for item in iterable <li>{{ user }}</li> # endfor </ul>