https://www.cnblogs.com/poloyy/tag/
https://www.cnblogs.com/poloyy/p/14999797.html
https://jingtian.blog.csdn.net/article/details/136361001?spm=1001.2101.3001.6650.3&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-3-136361001-blog-120347114.235%5Ev43%5Epc_blog_bottom_relevance_base3&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-3-136361001-blog-120347114.235%5Ev43%5Epc_blog_bottom_relevance_base3&utm_relevant_index=4
1.靜態(tài)文件引入:{{ url_for('static', filename='文件路徑') }}
2.定義路由:{{ url_for('函數(shù)名'澎羞,變量=參數(shù)) }}
3.定義數(shù)據(jù)塊:{% block 數(shù)據(jù)塊名稱 %}…{% endblock %}
4.繼承模板:{% extends "home/home.html" %}
5.包含模板: {% include "home/menu.html" %}
轉(zhuǎn)載于:[https://www.cnblogs.com/Paul-watermelon/articles/10102198.html](https://www.cnblogs.com/Paul-watermelon/articles/10102198.html)
jinja2 模板文件混合 html 語(yǔ)法與 jinja2 語(yǔ)法,使用分界符區(qū)分 html 語(yǔ)法與 jinja2 語(yǔ)法搪柑。有 5 種常見的分界符:
{{ 變量 }}岛马,將變量放置在 {{ 和 }} 之間;
{% 語(yǔ)句 %}届案,將語(yǔ)句放置在 {% 和 %} 之間庵楷;
{# 注釋 #},將注釋放置在 {# 和 #} 之間楣颠;
## 注釋尽纽,將注釋放置在 # 之后
變量
語(yǔ)法
jinja2 模板中,使用 {{ var }} 包圍的標(biāo)識(shí)符稱為變量童漩,模板渲染會(huì)將其替換為 Python 中的變量弄贿,語(yǔ)法如下:
{{ 變量 }}
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>
### tests
#### 語(yǔ)法
jinja2 提供的 tests 可以用來(lái)在語(yǔ)句里對(duì)變量或表達(dá)式進(jìn)行測(cè)試,語(yǔ)法如下:
<code-box id="code-ApYwTY" style="padding: 0px; margin: 5px; letter-spacing: 0.75px; position: relative; display: block; border-radius: 4px; box-shadow: rgba(37, 44, 97, 0.15) 0px 4px 11px -2px, rgba(93, 100, 148, 0.06) 0px 1px 3px 0px;"><pre boxid="code-ApYwTY" class="hljs ceylon code-pre-line" style="padding: 0.5em; margin: 0px; letter-spacing: 0.75px; transition-duration: 0.2s; transition-property: background, font-size, border-color, border-radius, border-width, padding, margin, color; overflow: auto; font-size: 12px; font-weight: 400; font-family: "Source Code Pro", Consolas, Menlo, Monaco, "Courier New", monospace !important; white-space: pre; border-radius: 4px; word-break: break-all; overflow-wrap: break-word; counter-reset: itemcounter 0; background: rgb(40, 44, 52); color: rgb(171, 178, 191); display: block; border: 1px solid rgb(204, 204, 204); position: relative; max-height: 120vh;">{% variable is test %}</pre></code-box>
完整的 test 請(qǐng)參考 [https://jinja.palletsprojects.com/en/latest/templates/#builtin-tests](https://jinja.palletsprojects.com/en/latest/templates/#builtin-tests)矫膨,部分的 test 如下:
| test 名稱 | 功能 |
| --- | --- |
| defined | 變量是否已經(jīng)定義 |
| boolean | 變量的類型是否是 boolean |
| integer | 變量的類型是否是 integer |
| float | 變量的類型是否是 float |
| string | 變量是否是 string |
| mapping | 變量的類型是否是字典 |
| sequence | 變量的類型是否是序列 |
| even | 變量是否是偶數(shù) |
| odd | 變量是否是奇數(shù) |
| lower | 變量是否是小寫 |
| upper |
變量是否是大寫
|
過(guò)濾器
語(yǔ)法
jinja2 過(guò)濾器的是一個(gè)函數(shù)差凹,語(yǔ)法如下:
{{ variable | filter }}
執(zhí)行函數(shù)調(diào)用 filter(varialbe),把函數(shù)返回值作為這個(gè)代碼塊的值
暫時(shí)不舉具體的栗子了侧馅,只做簡(jiǎn)單介紹直奋,目測(cè)后面我會(huì)出詳細(xì)文章講解 jinja2
#fastapi +jinja2模板主要用在前后端不分離項(xiàng)目中
在jinja2中,存在三種語(yǔ)法:
1施禾、控制結(jié)構(gòu) {% %}
2脚线、變量取值 {{ }}
3、注釋 {# #}
列表類型數(shù)據(jù)渲染
return templates.TemplateResponse(
‘index.html’, #第一個(gè)參數(shù)放模板文件
{
‘request’: request, # 注意弥搞,返回模板響應(yīng)時(shí)邮绿,必須有request鍵值對(duì)渠旁,且值為Request請(qǐng)求對(duì)象
‘user’:name,
‘a(chǎn)ge’:age,
‘people’:people,
“books”: [“西游記”, “紅樓夢(mèng)”],
“booksDict”: {
“西游記”: {“price”: 100, “publish”: “蘋果社”},
“紅樓夢(mèng)”: {“price”: 200, “publish”: “橘子社”},
}
}, #context上下文對(duì)象,是個(gè)字典
)
在html頁(yè)面展示
<p>{{ books.0 }}</p>
<p>{{ books.1 }}</p>
<p>{{ books.2 }}</p>
<p>{{ books.3 }}</p>
<ul>
{% for book in books %}
<li>{{ book }}</li> <!--凡是變量都要用兩個(gè)大括號(hào)括起來(lái)-->
{% endfor %}
</ul>
字典類型數(shù)據(jù)渲染
在html頁(yè)面通過(guò)點(diǎn)的方式獲取
<p>{{ booksDict.西游記.publish }}</p>
jinja2 的過(guò)濾器
只需要在html文件中的變量后?使?管道(|)分割船逮,多個(gè)過(guò)濾器可以鏈?zhǔn)秸{(diào)?顾腊,前?個(gè)過(guò)濾器的輸出會(huì)作為后?個(gè)過(guò)濾器的輸?。
{{user | capitalize }} 首字母大寫
{{ ‘a(chǎn)bc’| upper }} # ABC
{{ ‘hello world’| title }} # Hello World
{{ “hello world”| replace(‘world’,‘yuan’) | upper }} # HELLO YUAN
{{ 18.18 | round | int }} # 18
jinja2 的控制結(jié)構(gòu)
if分支
{% if age > 18 %}
<p>成年區(qū)</p>
{% else %}
<p>未成年區(qū)</p>
{% endif %}
循環(huán)控制
jinja2中的for循環(huán)?于迭代Python的數(shù)據(jù)類型挖胃,包括列表杂靶,元組和字典。在jinja2中不存在while循環(huán)酱鸭。
{% for book in books %}
<p>{{ book }}</p>
{% endfor %}