Django模板層

一.模板語言的變量

views.py

def index(request):
    #模板語言的變量
    name = 'Yven'
    addr = False
    age = 180
    li = [1,2,3,4,['a','b','c']]
    dic = {'name':'lyf','age':18,'hobby':['run','play']}
    def test():
        return 'test'

    class MyTest():
        def __init__(self,name,age):
            self.name = name
            self.age = age
        def getName(self):
            return self.name
        @classmethod
        def test_cls(cls):
            return 'cls方法'
        @staticmethod
        def static_test():
            return '靜態方法'

    from django.utils import safestring
    link1 = '<a href="https://www.baidu.com">點我<a>'
    link1 = safestring.mark_safe(link1)
    mytest = MyTest('Yven',18)
    import datetime
    now = datetime.datetime.now()
    value = []
    return render(request,'index.html',locals())

html

<h2>模板語言的變量</h2>
<div>
    <p>字符串:{{ name }}</p>
    <p>數字:{{ age }}</p>
    <p>列表:{{ li }}</p>
    <p>列表取值:{{ li.4.1 }}</p>
    <p>字典取值:{{ dic.name }}</p>
    <p>字典:{{ dic }}</p>
    <p>函數:{{ test }}</p>
    <p>對象:{{ mytest.age }}</p>
    <p>對象的類方法:{{ mytest.test_cls }}</p>
    <p>對象的靜態方法:{{ mytest.static_test }}</p>
    <p>未被解析的字符串:{{ link1 }}</p>
</div>

二.模板的過濾器

過濾器語法:

{{ obj|filter_name:param }} 變量名|過濾器名:參數

<h2>模板的過濾器</h2>
<div>
    {#  default:若是該變量是False或者爲空,使用給定的默認值  #}
    <p>{{ addr|default:'上海' }}</p>
    
    {#  length:返回該變量的長度  #}
    <p>{{ li|length }}</p>
    
    {#  filesizeformat:將值格式化爲一個文件尺寸單位  #}
    <p>{{ 1024|filesizeformat }}</p>
    
    {#  date:將事件格式化爲自定義的格式  #}
    <p>{{ now|date:'Y/m/d' }}</p>
    
    {#  slice:將值按要求切片,可設置步長  #}
    <p>{{ li|slice:'1:-1' }}</p>
    
    {#  truncatechars:字符串多於指定的字符數量,會被截斷,自動添加的...也算在指定數量中  #}
    <p>{{ 'abcdefghijklm'|truncatechars:8 }}</p>
    
    {#  truncatewords:字符串詞數多於指定的數量,會被階段,自動添加...不算在指定數量中  #}
    <p>{{ 'abc def ghi jkl m'|truncatewords:3 }}</p>
    
    {#  safe:設置時,若是該值爲頁面能夠解析的語言,就會被識別  #}
    <p>{{ '<a href="#">點我一下</a>'|safe }}</p>
</div>

其餘的過濾器

過濾器	描述	示例
upper	以大寫方式輸出	{{ user.name | upper }}
add	給value加上一個數值	{{ user.age | add:」5」 }}
addslashes	單引號加上轉義號
capfirst	第一個字母大寫	{{ ‘good’| capfirst }} 返回」Good」
center	輸出指定長度的字符串，把變量居中	{{ 「abcd」| center:」50」 }}
cut	刪除指定字符串	{{ 「You are not a Englishman」 | cut:」not」 }}
date	格式化日期
default	若是值不存在，則使用默認值代替	{{ value | default:」(N/A)」 }}
default_if_none	若是值爲None, 則使用默認值代替
dictsort	按某字段排序，變量必須是一個dictionary	{% for moment in moments | dictsort:」id」 %}
dictsortreversed	按某字段倒序排序，變量必須是dictionary
divisibleby	判斷是否能夠被數字整除	{{ 224 | divisibleby:2 }} 返回 True
escape	按HTML轉義，好比將」<」轉換爲」&lt」
filesizeformat	增長數字的可讀性，轉換結果爲13KB,89MB,3Bytes等	{{ 1024 | filesizeformat }} 返回 1.0KB
first	返回列表的第1個元素，變量必須是一個列表
floatformat	轉換爲指定精度的小數，默認保留1位小數	{{ 3.1415926 | floatformat:3 }} 返回 3.142 四捨五入
get_digit	從個位數開始截取指定位置的數字	{{ 123456 | get_digit:’1’}}
join	用指定分隔符鏈接列表	{{ [‘abc’,’45’] | join:’’ }} 返回 abc45
length	返回列表中元素的個數或字符串長度
length_is	檢查列表，字符串長度是否符合指定的值	{{ ‘hello’| length_is:’3’ }}
linebreaks	用 或 標籤包裹變量	{{ 「Hi\n\nDavid」|linebreaks }} 返回 Hi David
linebreaksbr	用 標籤代替換行符
linenumbers	爲變量中的每一行加上行號
ljust	輸出指定長度的字符串，變量左對齊	{{‘ab’|ljust:5}}返回 ‘ab ’
lower	字符串變小寫
make_list	將字符串轉換爲列表
pluralize	根據數字肯定是否輸出英文複數符號
random	返回列表的隨機一項
removetags	刪除字符串中指定的HTML標記	{{value | removetags: 「h1 h2」}}
rjust	輸出指定長度的字符串，變量右對齊
slice	切片操做， 返回列表	{{[3,9,1] | slice:’:2’}} 返回 [3,9] {{ 'asdikfjhihgie' | slice:':5' }} 返回 ‘asdik’
slugify	在字符串中留下減號和下劃線，其它符號刪除，空格用減號替換	{{ '5-2=3and5 2=3' | slugify }} 返回 5-23and5-23
stringformat	字符串格式化，語法同python
time	返回日期的時間部分
timesince	以「到如今爲止過了多長時間」顯示時間變量	結果可能爲 45days, 3 hours
timeuntil	以「從如今開始到時間變量」還有多長時間顯示時間變量
title	每一個單詞首字母大寫
truncatewords	將字符串轉換爲省略表達方式	{{ 'This is a pen' | truncatewords:2 }}返回``This is ...
truncatewords_html	同上，但保留其中的HTML標籤	{{ '<p>This is a pen</p>' | truncatewords:2 }}返回``<p>This is ...</p>
urlencode	將字符串中的特殊字符轉換爲url兼容表達方式	{{ ‘http://www.aaa.com/foo?a=b&b=c’ | urlencode}}
urlize	將變量字符串中的url由純文本變爲連接
wordcount	返回變量字符串中的單詞數
yesno	將布爾變量轉換爲字符串yes, no 或maybe	{{ True | yesno }}{{ False | yesno }}{{ None | yesno }} ``返回 ``yes``no ``maybe

三.模板的標籤

標籤看起來像是這樣的{% tag %},標籤比變量更加複雜:一些在輸出中建立文本,一些經過循環或邏輯來控制流程,一些加載其後的變量將使用到的額外信息到模板中。一些標籤須要開始和結束標籤

for標籤

和python中的for循環相似,遍歷每個元素:

{% for person in person_list%}
    <p>{{ person.name }}</p>
{% endfor %}

tips:能夠利用{% for obj in list reversed %}反向完成循環

{{forloop}}

forloop.counter            The current iteration of the loop (1-indexed) 當前循環的索引值（從1開始）
forloop.counter0           The current iteration of the loop (0-indexed) 當前循環的索引值（從0開始）
forloop.revcounter         The number of iterations from the end of the loop (1-indexed) 當前循環的倒序索引值（從1開始）
forloop.revcounter0        The number of iterations from the end of the loop (0-indexed) 當前循環的倒序索引值（從0開始）
forloop.first              True if this is the first time through the loop 當前循環是否是第一次循環（布爾值）
forloop.last               True if this is the last time through the loop 當前循環是否是最後一次循環（布爾值）
forloop.parentloop         本層循環的外層循環

for..empty..

for標籤的一個可選的從句({% empty %}),以便在給出的組是空的或者沒有被找到時,能夠有所操做

{% for person in person_list%}
    <p>{{ person.name }}</p>
{% empty %}
    <p>no this one</p>
{% endfor %}

if標籤

一樣與python中的if語句相似,會對一個變量進行判斷,若是它的值爲True,對應的內容塊會輸出.

該標籤支持and、or、==、>、<、>=、<=、!=、in、not in、is、is not判斷

<div>
    {% if age > 90  %}
        <p>老大</p>
    {% elif age > 50 and age < 90 %}
        <p>老二</p>
    {% else %}
        <p>小弟</p>
    {% endif %}
</div>

with標籤

使用一個簡單地名字緩存一個複雜的變量名,至關於取別名

<div>
    {% with business.employees.count as a %}
        {{ a }}
    {% endwith %}
</div>

四.自定義標籤和過濾器

自定義標籤和過濾器的前提:
1.在settings中INSTALLED_APPS配置當前app,否則django沒法找到自定義的simple_tag
2.在app中建立templatetags模塊(模塊名只能是templatetags)
3.在templatetags中建立任意.py文件.

mytag.py文件

# 1.導入template
from django import template

# 2.定義一個交register的變量  賦值template.Library()
register = template.Library()

# 3 自定義過濾器和標籤
@register.filter(name='lyf')
def str_add(str1, str2):
    return str1 + str2

@register.simple_tag()
def add_nb(value):
    return value+'nb'

使用自定過濾器和標籤

須要在使用前加{% load py文件名%}

<h1>自定義過濾器</h1>
{% load mytag %}
{{ 'yven'|lyf:'666' }}

<h1>自定義標籤</h1>
{% add_nb 'Yven' %}

注意:filter能夠用在if等語句後,simple_tag不能夠

{% if 'yven'|lyf:'666' %}
    {{ 'yven'|lyf:'666' }}
{% endif %}

五.模板導入和繼承

模板導入

一般使用模板導入是由於頁面頭部頁面和左側導航菜單內容沒有變化,只有右部內容在變化,若是不使用模板的導入會形成大量的代碼冗餘.
語法:{% include "模板名稱" %}

adv.html

<div class="adv">
    <div class="panel panel-warning">
        <div class="panel-body">
            Panel content
        </div>
        <div class="panel-footer">Panel footer</div>
    </div>
    <div class="panel panel-danger">
        <div class="panel-body">
            Panel content
        </div>
        <div class="panel-footer">Panel footer</div>
    </div>

</div>

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首頁</title>
    <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.css">
    <style>
        .head{
            height:100px;
            background-color: #9d9d9d;
        }
    </style>
</head>
<body>
    <div class="head"></div>
    <div class="container">
        <div class="row">
            <div class="col-md-3">
                {% include 'adv.html' %}
            </div>
            <div class="col-md-9">
            </div>
        </div>
    </div>
</body>
</html>

模板繼承

Django模板引擎中最強大也是最複雜的部分就是模板繼承,模板繼承可讓您建立一個基本的骨架模板,它包含站點中的所有元素,而且能夠定義可以被子模板覆蓋的blocks.

base.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}
        這是母版
    {% endblock %}</title>

</head>
<body>
<div class="head">
    {% block content %}
        這是內容
    {% endblock %}
</div>
</body>
</html>

block.html

{% extends 'base.html' %}
{% block title %}
    這是神奇的母板
{% endblock %}

{% block content %}
    {{ block.super }}
    很酷的內容
{% endblock %}

上面咱們定義了一個母版base.html,而後又定義了一個子模板block.html,子模板的工做是用它們的內容去填充母版中的block標籤,該例子中定義了兩個block.

在子模板中使用extends標籤來完成繼承的功能,它告訴模板引擎,這個模板繼承另外一個模板.若是子模板中並無定義母版中的block,系統會使用母版中原有block的值,也能夠在子模板中使用{{ block.super }}讓母版的該block值不被覆蓋,與子模板中該block的值同時存在.

輸出以後的結果,就應該是這樣的

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>
        這是神奇的母板
    </title>

</head>
<body>
<div class="head">

    這是內容 很酷的內容
    
</div>
</body>
</html>

使用模板繼承的注意事項:

• 若是你在模版中使用 {% extends %} 標籤，它必須是模版中的第一個標籤。其餘的任何狀況下，模版繼承都將沒法工做。

• 在base模版中設置越多的 {% block %} 標籤越好。請記住，子模版沒必要定義所有父模版中的blocks，因此，你能夠在大多數blocks中填充合理的默認內容，而後，只定義你須要的那一個。多一點鉤子總比少一點好。

• 若是你發現你本身在大量的模版中複製內容，那可能意味着你應該把內容移動到父模版中的一個 {% block %} 中。

• If you need to get the content of the block from the parent template, the {{ block.super }} variable will do the trick. This is useful if you want to add to the contents of a parent block instead of completely overriding it. Data inserted using {{ block.super }} will not be automatically escaped (see the next section), since it was already escaped, if necessary, in the parent template.

• 爲了更好的可讀性，你也能夠給你的 {% endblock %} 標籤一個 名字 。例如：

  在大型模版中，這個方法幫你清楚的看到哪個　 {% block %} 標籤被關閉了。

• 不能在一個模版中定義多個相同名字的 block 標籤。

六.靜態文件相關

1 寫死靜態文件:<link rel="stylesheet" href="/static/css/mycss.css">

2 使用 static標籤函數:
-{%load static%}
static返回值,會拼上傳參的路徑
-{% static "傳參"%}
如:{% static 'bootstrap-3.3.7-dist/css/bootstrap.css' %}
`
3 使用get_static_prefix 標籤
-{%load static%}
get_static_prefix返回值是:靜態文件的地址,至關於/static/
-{% get_static_prefix %}'路徑'
如:{% get_static_prefix %}bootstrap-3.3.7-dist/css/bootstrap.css