一些常用會用到的內(nèi)置標(biāo)簽。
include
往往制作模板的時候,我們會將一些公共部分,比如header、footer、aside等部分,抽離出來獨立存放,不需要在每一個頁面都重復(fù)編寫,只需要在每一個頁面引入它們即可。這個時候,我們可以使用include標(biāo)簽。
{% include "partial/header.html" %}
{% include "partial/footer.html" %}
include可以將一個拆分出來的代碼片段(fragment)
嵌入到完整的文檔中。使用形式是{% include "模板文件" %}
。
如果需要引入的模板不存在的話,它會報錯,如我我們不知道引入的模板是否存在,則需要增加if_exists
判斷。
{% include "partial/header.html" if_exists %}
這樣如果header.html
模板存在的話,則會引入,即使不存在,也不會報錯,只是被忽略掉了。
默認情況下,include
引入的模板,它會繼承當(dāng)前模板的所有變量,如果想給include
引入的模板增加另外的變量,可以使用with
來增加。如:
{% include "partial/header.html" with title="這是聲明給header使用的title" %}
這樣就給include
引入的模板定義了title
變量,當(dāng)前模板的其他變量它同樣也可以繼續(xù)使用了。
如果需要聲明多個變量給include
引入的模板使用,可以連續(xù)使用key=value
的形式增加,它們之間使用空格隔開,如:
{% include "partial/header.html" with title="這是聲明給header使用的title" keywords="這是聲明給header使用的keywords" %}
如果只想讓include
引入的模板使用指定的幾個變量,而不是當(dāng)前模板的所有變量,可以使用only
來做限制:
{% include "partial/header.html" with title="這是聲明給header使用的title" keywords="這是聲明給header使用的keywords" only %}
然后在header.html
中使用:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{title}}</title>
<meta name="keywords" content="{{keywords}}">
</head>
macro
iris.Django
模板引擎可以很簡便的定義一些宏函數(shù)代碼片段。宏代碼片段相當(dāng)于一個函數(shù),它只能調(diào)用從參數(shù)傳入的變量。類似于使用include
。不過macro
有限定的作用域。如文章我們給文章列表的文章item
使用macro
:
定義一個宏函數(shù)
{% macro archive_detail(archive) %}
<li class="item">
<a href="/archive/{{archive.Id}}" class="link">
<h5 class="title">{{archive.Title}}</h5>
</a>
</li>
{% endmacro %}
使用定義的宏函數(shù)
{% for item in archives %}
{{ archive_detail(item) }}
{% endfor %}
同時宏函數(shù)還可以保存到獨立的文件中,然后通過import
來嵌套進來。當(dāng)一個文件中包含多個宏函數(shù),可以使用,
將隔開連續(xù)引入多個宏函數(shù)。還可以使用as
來設(shè)置別名:
保存宏函數(shù)到 archive.helper
{% macro archive_detail(archive) %}
<li class="item">
<a href="/archive/{{archive.Id}}" class="link">
<h5 class="title">{{archive.Title}}</h5>
</a>
</li>
{% endmacro %}
{% macro archive_detail2(archive) %}
<li class="item">
<a href="/archive/{{archive.Id}}" class="link">
<h5 class="title">{{archive.Title}}</h5>
</a>
</li>
{% endmacro %}
在index.html
中引入:
用import引入:
{% import "archive.helper" archive_detail, archive_detail2 as archive_detail_new, archive_detail as new_item %}
調(diào)用:
{% for item in archives %}
{{ archive_detail(item) }}
{{ archive_detail_new(item) }}
{{ new_item(item) }}
{% endfor %}
extends
模板的繼承有點像ppt中的母版一樣,我們定義好一個骨架,將一個頁面都寫好,大部分不用變動,需要變動的部分使用block標(biāo)簽
包裹起來:
{% block title %}
<title>base</title> <!-- 如果擴寫了就是擴寫的,不擴寫就還是用base -->
{% endblock %}
這樣定義的好處是,可以在繼承它的模板中,重寫這個block
,不重寫就按母版來顯示。
比如我們定義了一個base.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
{% block title %}
<title>base</title> <!-- 如果擴寫了就是擴寫的,不擴寫就還是用base -->
{% endblock %}
<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<style>
* {
margin: 0;
padding: 0;
}
.header {
width: 100%;
height: 50px;
background-color: #369;
}
</style>
</head>
<body>
<div class="header"></div>
<div class="container">
<div class="row">
<div class="col-md-3">
{% include 'aside.html' %}
</div>
<div class="col-md-9">
{% block content %}
<h4>content</h4>
{% endblock %}
</div>
</div>
</div>
</body>
</html>
然后在index.html
中繼承這個base.html
{% extends 'base.html' %}
{% block title %}
<title>index</title>
{% endblock %}
{% block content %}
<div class="col-md-9">
<h3>index</h3>
<p>index content</p>
</div>
{% endblock %}
這樣就是使用base.html
作為母版,并在index.html
中重寫了title、content
兩個部分。
注意:如果你在模版中使用{% extends %}
標(biāo)簽,它必須是模版中的第一個標(biāo)簽。其他的任何情況下,模版繼承都將無法工作。
在使用繼承的情況下,盡可能將可能會變動的數(shù)據(jù),都包裹在block
中,因為block即使在后續(xù)的頁面不重寫,也不影響模板的解析,而需要重寫的時候就更方便。
同樣地,如果后續(xù)寫到某一塊,發(fā)現(xiàn)多個頁面都需要使用到,那么這時候,就把添加到base.html
中去,讓它成為母版的一部分。
Django 模板中遍歷復(fù)雜數(shù)據(jù)結(jié)構(gòu)的關(guān)鍵是句點字符.,變量輸出邊界定義是雙大括號。有一個對象是people,它有Name、Gender、Level屬性,在模板中輸出就是:
<ul>
<li>網(wǎng)站:{{siteName}}</li>
<li>名字:{{people.Name}}</li>
<li>性別:{{people.Gender}}</li>
<li>等級:{{people.Level}}</li>
</ul>
比如在archive列表中,archive的結(jié)構(gòu)體中,定義了內(nèi)置函數(shù)func (archive *Archive) GetThumb()
,那么在模板中,是可以直接調(diào)用的。如:
{% for item in archives %}
<li class="item">
<a href="/archive/{{item.Id}}" class="link">
<img src="{{item.GetThumb()}}" alt="{{item.Title}}" />
<h5 class="title">{{item.Title}}</h5>
</a>
</li>
{% endfor %}
模板可以直接使用{{item.GetThumb()}}
來調(diào)用內(nèi)置的archive.GetThumb()
方法。
now
標(biāo)簽提供在模板中輸出當(dāng)前時間。now格式化時間的參數(shù)遵循golang的時間格式化規(guī)則。如果增加fake 參數(shù),則會輸出一個特定的加時間代替當(dāng)前時間。如:
{% now "Mon Jan 2 15:04:05 -0700 MST 2006" fake %}
{% now "2006-01-02 15:04" %}
lorem
隨機生成拉丁文樣本數(shù)據(jù)顯示隨機的“ lorem ipsum”拉丁文本。 這對于在模板中提供樣本數(shù)據(jù)很有用。也就是占位內(nèi)容。在開發(fā)模板沒有真實數(shù)據(jù)的時候,使用這個標(biāo)簽可以快速填充足夠多的隨機數(shù)據(jù)。如:
-----
{% lorem %}
-----
{% lorem 10 %}
-----
{% lorem 3 p %}
-----
{% lorem 100 w %}
-----
iris.Django
的注釋我們使用大括號+#來實現(xiàn)注釋:{# 注釋內(nèi)容 #}
單行注釋使用 {# 這只能注釋單行 #}
,多行注釋使用 {% comment %}
這里注釋很多行{% endcomment %}
。
示例:
空單行注釋
{# #}
單行注釋
{# testing single line comment #}
用有效標(biāo)簽填充單行注釋
{# testing single line comment {% if thing %}{% endif %} #}
用無效標(biāo)簽填充單行注釋
{# testing single line comment {% if thing %} #}
用無效語法填充單行注釋
{# testing single line comment {% if thing('') %}wow{% endif %} #}
空塊注釋
{% comment %}{% endcomment %}
填充文本單行塊注釋
{% comment %}filled block comment {% endcomment %}
空多行塊注釋
{% comment %}
{% endcomment %}
阻止帶有其他標(biāo)簽的注釋
{% comment %}
{{ thing_goes_here }}
{% if stuff %}do stuff{% endif %}
{% endcomment %}
阻止其中帶有無效標(biāo)簽的注釋
{% comment %}
{% if thing %}
{% endcomment %}
使用無效語法阻止注釋
{% comment %}
{% thing('') %}
{% endcomment %}
注釋之間的常規(guī)標(biāo)簽,以確保其在詞法分析器中不會中斷
{% if hello %}
{% endif %}
after if
{% comment %}All done{% endcomment %}