Django框架之第五篇（模板層） --變量、過濾器（|）、標籤（% %）、自定義標籤、過濾器、inclusion_tag，模板的繼承、模板的注入、靜態文件

模板層

模板層就是html頁面，Django系統中的（template）

1、視圖層(views)給模板傳值的兩種方法

方式一：經過鍵值對的形式傳參，指名道姓的傳參

n = 'xxx'
f = 'yyy'
return render(request,'reg.html',{'n':n,'f':f})  #前面的n是參數名，後面的n纔是具體的值

方式二：使用local()傳所有的值，該方法雖好可是挺浪費空間資源的（通常都使用這種方式）

return render(request,'reg.html',locals()) 

模板層(html頁面)接收參數：

{{ n }}

{{ f }}

{{ index }}    傳遞index函數值，index要寫return返回值纔會有結果，否則返回None

傳值須要主要注意的地方：

1.當你在視圖層傳函數給前端模板，只須要在模板層寫函數名{{index}},傳函數名會自動加括號調用該函數，前端展現的是函數調用後的返回值。若是函數須要參數的話，模板語法就不支持了。

2.也能夠傳遞對象{{obj}}

使用對象的方法：{{obj.方法名}}

 2、模板層變量

模板語法：分爲兩大類

{{變量名}}    變量相關
{{%  %}}     邏輯相關

模板變量

<p>字符串:{{ name }}</p>   # 至關於print(name)
<p>數字:{{ age }}</p>   # 至關於print(age)
<p>列表:{{ ll }}</p>  # 至關於print(ll)
<p>元祖:{{ tu }}</p>  # 至關於print(tu)
<p>字典:{{ dic }}</p>   # 至關於print(dic)
{#只寫函數名:至關於函數名(),執行該函數#}
<p>函數:{{ test }}</p>     # 至關於print(test())  前端展現函數調用的返回值
{#對象內存地址#}
<p>對象:{{ lxx }}</p>    # 至關於print(lxx)
<p>列表套對象:{{ person_list }}</p>
<p>字典套對象:{{ person_dic }}</p>

模板深度查詢   統一使用句點符'.'

<p>列表第0個值:{{ ll.0 }}</p>
<p>列表第3個值:{{ ll.3 }}</p>
<p>字典取值:{{ dic.name }}</p>
<p>字典取列表值:{{ dic.ll }}</p>
{#再繼續取值,繼續點#}
<p>對象取數據屬性:{{ lxx.name }}</p>
<p>對象取綁定給對象的函數屬性:{{ lxx.get_name }}</p>
<p>對象取綁定給類的函數屬性:{{ lxx.cls_test }}</p>
<p>對象取靜態方法:{{ lxx.static_test }}</p>
<p>把對象列表中egon年齡取出來:{{ person_list.1.age }}</p>
{#拓展:不能調有參數的方法#}
<p>字符串的方法:{{ name.upper }}</p>

3、模板層之過濾器（Filters）

在Django的模板語法中，經過使用過濾器來改變變量在頁面的顯示

1.過濾器的語法：{{value|filter_name:參數}}

使用管道符‘|’ 來應用過濾器

{{須要過濾的數據|過濾器的名字：過濾參數}}

2.經常使用的過濾器

1.default  若是一個變量是false或者爲空，使用給定的默認值。不然，使用變量的值。

<p>過濾器之默認值：{{ value|default:"nothing"}}</p>

若是value沒有傳值或者值爲空的話就顯示nothing (這裏value是變量)

2.length  返回值的長度，做用於統計字符串和列表的長度

{{ value|length }}

返回value的長度，如 value=['a', 'b', 'c', 'd']的話，就顯示4.

3.filesizeformat  將值格式化爲一個可讀的文件尺寸（例如'13kb','4.1MB',等等）

{{ value|filesizeformat }}

若是 value 是 123456789，輸出將會是 117.7 MB

4.slice   切片

{{value|slice:'2:-1'}}  前閉後開區間

支持設置步長
{{name|slice:'0:3:3'}}

5.date  時間格式化

from datetime import datetime
ctime = datetime.now()

{{ ctime|date:"Y-m-d H:i:s"}}

6.safe  取消轉義

前端取消轉義能夠用 |safe  (正常顯示出html,js標籤樣式)

視圖層    
xxx='<h1>波波棋牌室</h1>' 模板層 {{xxx|safe}} #取消轉義h1標籤就會起做用

後端取消轉義

視圖層
from django.utils.safestring import mark_safe zzz = mark_safe('<h1>阿薩德搜啊第三款垃圾袋</h1>') 模板層 直接寫 {{zzz}}

7.truncatechars  按照指定字符截取內容，截斷的字符以省略號(...)結尾（省略號算3個字符數量）

參數：指定截斷的字符數

{{ info|truncatechars:6 }}

8.truncatewords  按空格截取（數字顯示的是截取的空格數，三個點不包含）

{{ info|truncatewords:3 }}

9.cut  移除value中全部的與給出的變量相同的字符串

{{ value|cut:' ' }}  #移除 ' '

若是value爲'i love you'，那麼將輸出'iloveyou'.

9.add    拼接（數字就相加，字符串就是拼接）

{{ n|add:100 }}
{{ s|add:'hahah 翻車啦' }}

3.其餘過濾器 

 

過濾器	描述	示例
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

 4、模板層之標籤 （邏輯相關） {%  %}

一、for 標籤

基本用法：遍歷每一個元素

視圖層：
def test(request):
    l=[1,2,3,4,5]
    return render(request,'login.html',locals())

模板層：
{% for foo in l %}
  {{ foo }}
{% endfor %}

forloop對象

{% for person in person_list %}
    <p>{{ forloop }}</p>
    <p>{{ forloop.parentloop }}</p>   # 本層循環的外層循環
    <p>{{ forloop.counter }}</p>    # 當前循環的索引，從1開始計
    <p>{{ forloop.counter0 }}</p>     # 當前循環的索引，從0開始計
    <p>{{ forloop.revcounter }}</p>   # 當前循環的倒序索引值（從1開始）
    <p>{{ forloop.revcounter0 }}</p>  # 當前循環的倒序索引值（從0開始）
    <p>{{ forloop.first }}</p>    # 當前循環是否是第一次循環
    <p>{{ forloop.last }}</p>   # 當前循環是否是最後一次循環
{% endfor %}

for...empty

for標籤帶有一個可選的{% empty %} 從句，在給出的循環對象是空的或者沒有被找到時執行

{% for user in user_list %}
    <li>{{ user.name }}</li>
{% empty %}
    <li>空空如也</li>
{% endfor %}

二、if標籤     

if/elif/else

{% if user_list %}
  用戶人數：{{ user_list|length }}
{% elif black_list %}
  黑名單數：{{ black_list|length }}
{% else %}
  沒有用戶
{% endif %}

也能夠只寫if和else

{% if user_list|length > 5 %}
  七座豪華SUV
{% else %}
    黃包車
{% endif %}

if語句支持 and 、or、==、>、<、!=、<=、>=、in、not in、is、is not判斷。

for循環和判斷結合一塊兒使用

{% for foo in l %}
  {% if forloop.first %}
    這是第一次
    {% elif forloop.last %}
      這是最後一次
    {% else %}
    來啊來啊
  {% endif %}
{% endfor %}

三、with標籤

定義一箇中間變量，多用於給一個複雜的變量起別名

兩種方式：

1.使用'=',注意等號兩邊不要加空格

{% with total=business.employees.count %}
    {{ total }} employee{{ total|pluralize }}
{% endwith %}

2.with as 配套使用能夠給一個比較複雜的取值操做取一個別名，以後在with語句中，就可使用該別名  (用的多)

{% with business.employees.count as total %}     #total是別名和business.employees.count取值是同樣的
    {{ total }} 
    {{business.employees.count}}
{% endwith %}

csrf_token

這個標籤用於跨站請求僞造保護。

在頁面的form表單裏面寫上{% csrf_token %}

5、自定義標籤過濾器

1.自定義過濾器（過濾器只能接收一個參數）

自定義過濾器
1. 先app是否是已經在setting中註冊
2. 在app下建立一個templatetags(****名字不能變***)的文件夾
3. 在模塊下建立一個py文件,名字隨意:mytag.py
4. 在該py文件中固定先寫下面兩句代碼：
　　# 第一步,導入template
   from django.template import Library
   # 第二步,定義一個叫register的變量=template.Library()
    register = Library()
5. 寫一個函數,用@register.filter(name='yyy')裝飾一下
    @register.filter(name='yyy')  #name指定別名
    def str_add(str1, str2): #必定要有返回值
       # 業務邏輯
       return str1 + str2
6. 在模板裏:(新定定義的標籤,過濾器,都要重啓程序)
    {% load mytag %}    #先加載過來
    {{'lqz'|yyy:'nb'}}  #也能夠寫{{'lqz' | str_add:'nb'}} str_add後面只能寫一個參數

2.自定義標籤(能夠接收多個參數)

自定義標籤:
1. 先app是否是已經在setting中註冊
2. 在app下建立一個templatetags(****名字不能變***)的文件夾
3. 在模塊下建立一個py文件,名字隨意:mytag.py
4. # 第一步,導入template
   from django.template import Library
   # 第二步,定義一個叫register的變量=template.Library()
    register = Library()
5. 寫一個函數,用@register.simple_tag(name='yyy')裝飾一下
    @register.simple_tag(name='yyy')   #取別名name def add_nb(a,b,c,d):
        # 業務邏輯
        return a+b+c+d
6. 在模板裏:(多個參數,以空格區分)
    {% load mytag %}
    {% yyy 1 2 3 4%}   #也能夠寫{% add_nb 1 2 3 4%} add_nb後面能夠接多個參數

3.自定義inclusion_tag

當你的頁面上有一部分html代碼須要常常被各個地方使用，而且須要傳參才能渲染出來，那麼你能夠把該html代碼部分製做成一個inclusion_tag

mytag.py

@register.inclusion_tag('bigplus.html')
def bigplus(n):
        l = []
        for i in range(n):
        l.append('第%s項'%i)
    return {'l':l}

bigplus.html  (定義常常要使用的html代碼)

 

reg.html    (bigplus是mytag中定義的函數，5是傳遞的參數)

 

 

6、模板的繼承

當多個頁面總體的樣式都大差不差的狀況下，能夠設置一個模板文件，在該母板文件中，使用block塊劃分多個預期，至關於用block佔位，以後子版在使用模板的時候，能夠經過block的名字，來區分須要修改哪一部分區域。

模板通常狀況下，應該至少有三個被修改的區域：css,js,子頁面的html代碼

1.使用模板的繼承

寫一個母版，須要留一個或多個能夠擴展的區域。母版中主要是使用空的block完成頁面的搭建

{%block 名字 %}
  能夠修改的內容
{%endblock%}

母版頁面
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="x-ua-compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Title</title>
  {% block css %}   #母版的css 內容
  
  {% endblock %}
</head>
<body>

<h1>這是母板的標題</h1>

{% block content %}  #母版的content內容

{% endblock %}
<h1>母板底部內容</h1>
{% block js %}      #母版js內容

{% endblock %}
</body>
</html>

在子模板中使用，子模板主要內容是填空母版中空的block

# extends 告訴模板引擎，這個模板繼承了另外一個模板
{% extends "base.html" %}

{% block 名字 %}
    子模板的內容
{% endblock 名字 %}

{% extends 'home.html' %}
{% block css %}
    <style>
        h1 {
            color: red;
        }
    </style>
{% endblock %}

{% block content %}

    {% include 'beautiful.html' %}
<h1>登錄頁面</h1>
    <form action="">
        <p>username:<input type="text" class="form-control"></p>
        <p>password:<input type="text" class="form-control"></p>
        <input type="submit" class="btn btn-danger">
    </form>
{% endblock %}

{% block js %}

{% endblock %}

2.強調（注意點）

• 若是母版的block中寫了內容，子模板頁面沒有重寫，那麼就會使用母版的內容，因此咱們在設置母版的block時，通常都是設置空內容。
• 一旦子模板頁面重寫了母版的block,往裏面寫值了，那麼就會覆蓋掉母版中block的內容
• 不能在一個模板中定義多個相同的block標籤

7、模板的導入

要反覆的使用一個組件，能夠將該組件寫在一個文件中，在使用的時候導入就能夠，在模板中使用

語法

{% include '模板名字' %}

{% include 'beautiful.html' %}

8、靜態文件

在Django框架第二篇中講到  http://www.javashuo.com/article/p-yuolbisn-by.html