jinja2是一種模板語言
- 三種語法：
1 {{ }} 變量取值
2 {% %} 控制結構
3 {# #} 註釋
jinja2模板中使用 {{ }} 語法表示一個變量，它是一種特殊的佔位符。當利用jinja2進行渲染的時候，它會把這些特殊的佔位符進行填充/替換，jinja2支持python中所有的Python數據類型比如列表、字段、對象等。
返回值爲一個字典：jinja2讀取數據鈺python不同：
@web.route('/test')
def test():
r = {
'name': 'wang',
'age': 20
}
return render_template('test.html', data=r)
# html 部分
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
wang
{{ data.age }}
{{ data['age'] }}
{# wang #}
{# 模板語言 #}
</body>
</html>
都可以取到20這個數據
python： r[‘age’]
jinja2：data.age data[‘age’]
jinja2的流程控制語句：
if 和 for in
語句必須是閉合的
if語句（endif）
可以使用一些python運算符
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
wang
{{ data.age }}
{{ data['age'] }}
{% if data.age < 20 %}
{{ data.name }}
{% elif data.age == 20 %}
do something
{% else %}
{{ data.age }}
<ul></ul>
{% endif %}
{# wang #}
{# 模板語言 #}
</body>
</html>
for in 循環（endfor）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
wang
{{ data.age }}
{{ data['age'] }}
{# if 條件判斷 #}
{% if data.age < 20 %}
{{ data.name }}
{% elif data.age == 20 %}
do something
{% else %}
{{ data.age }}
<ul></ul>
{% endif %}
{# for in 循環 #}
{% for foo in [1, 2, 3] %}
{{ foo }}
<div>111</div>
{% endfor %}
{# wang #}
{# 模板語言 #}
</body>
</html>
layout.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
{# 定義三個區域 #}
{% block head %}
<div>this is head</div>
{% endblock %}
{% block content %}
this is content
{# 待替換的部分 #}
{% endblock %}
{% block foot %}
<div>this is foot</div>
{% endblock %}
</body>
</html>
test.html
加上super()方法，繼承，保留之前填充部分的內容
不加super()方法，覆蓋之前的所有內容
{% extends 'layout.html' %}
{% block content %}
{{ super() }} {# 繼承，保留原來的content內容 #}
{{ data.age }}
{{ data['age'] }}
{# if 條件判斷 #}
{% if data.age < 20 %}
{{ data.name }}
{% elif data.age == 20 %}
do something
{% else %}
{{ data.age }}
<ul></ul>
{% endif %}
{# for in 循環 #}
{% for foo in [1, 2, 3] %}
{{ foo }}
<div>111</div>
{% endfor %}
{% endblock %}