Django -- 模板系統

語法

變量相關的用 :{{ 變量 }}

邏輯相關的用: {% 邏輯 %}

變量

# views.py代碼
    def index(request):
        num = 100
        name = 'xin'
        name_list = ['張三','李四','王二麻子']
        dic = {'name':'Alex','age':73,'hobby':'抽煙'}
?
        class Animal:
            def __init__(self):
                self.kind = 'dog'
            def eat(self):
                return 'shi'
        a = Animal()
?
        return render(request,'index.html',{'num':num,'name':name,'namelist':name_list,'d1':d1,'a':a})
        # return render(request,'index.html',locals()) 
        locals() 獲取函數內部所有變量的值,并加工成{'變量名':'變量值'....}這樣一個字典
        
# html代碼:
    <p>{{ num }}</p>
    <p>{{ name }}</p>
    <p>{{ name_list.2 }}</p>  # 通過 .索引 來取值
    <p>{{ d1.age }}</p>  # 通過 .鍵 取值
    <p>{{ a.kind }}</p>  # 調用屬性
    <p>{{ a.eat }}</p>  # 調用類中方法

View Code

過濾器

default : 如果一個變量是false或者為空,使用給定的默認值.否則使用變量的值
```
{{ value|default:"nothing"}}
```

length : 返回值的長度,作用于字符串和列表。

views.py : mes = 'I love you three thousand times'
html代碼 : {{ mes|length }}  # 31,空格也算一個字符

filesizeformat : 將值格式化為一個 “人類可讀的” 文件尺寸（例如 '13 KB', '4.1 MB', '102 bytes', 等等）
```
filesize = 234352452
{{ filesize|filesizeformat }} # 223.5 MB
```
slice : 切片,如果 value="hello world",還有其他可切片的數據類型
```
{{value|slice:"2:-1"}}
```
date : 格式化,如果 value=datetime.now()
```
{{ value|date:"Y-m-d H:i:s"}}
```

safe : 將字符串識別成標簽

val = '<a >百度</a>'
ret = "<script>alert('123')</script>"
?
{{ val|safe }} # 生成a標簽的樣式
{{ ret|safe }} # 有js的樣式

truncatechars : 如果字符串字符多于指定的字符數量，那么會被截斷。截斷的字符串將以可翻譯的省略號序列（“...”）結尾。

mes = 'I love you three thousand times'
{{ value|truncatechars:10}} #注意：最后那三個省略號也是9個字符里面的，也就是這個9截斷出來的是6個字符+3個省略號，得到結果 : I love ... (空格一算一個字符)

truncatewords : 在一定數量的字后截斷字符串，是截多少個單詞。

mes = 'I love you three thousand times'
{{ value|truncatewords:3}} # I love you ...

cut : 移除所有的與給出變量相同的字符串

mes = 'I love you three thousand times'
{{ value|cut:' ' }} # Iloveyouthreethousandtimes

join : 使用字符串連接列表,類似于python中str.join(list)
```
lis = [11,22,33]
{{ lis|join:'-' }} # 11-22-33
```

標簽Tags

for標簽

遍歷每一個元素：寫個for，然后 tab鍵自動生成for循環的結構

dic = {'name':'alex','age':77}
?
{% for k,v in dic.items %}  # 循環字典
    <li>{{ k }} - {{ v }}</li>
{% endfor %}
# name - alex
# age - 77

- for循環的其他方法

注意循環序號可以通過 {{ forloop }} 顯示 , 必須在循環內部使用

forloop.counter      當前循環的索引值(從1開始)，forloop是循環器，通過點來使用功能
forloop.counter0     當前循環的索引值（從0開始）
forloop.revcounter   當前循環的倒序索引值（從1開始）
forloop.revcounter0  當前循環的倒序索引值（從0開始）
forloop.first        當前循環是不是第一次循環（布爾值）
forloop.last         當前循環是不是最后一次循環（布爾值）
forloop.parentloop   本層循環的外層循環的對象，再通過上面的幾個屬性來顯示外層循環的計數等
forloop.parentloop.counter
?
示例:
<ul>
    {% for book in book_list %}
        <li>{{ forloop.counter }} {{ book }}</li>
    {% endfor %}
</ul>

for ... empty

for 標簽帶有一個可選的{% empty %} 從句，以便在給出的組是空的或者沒有被找到時，可以有所操作。

{% for person in person_list %}
    <p>{{ person.name }}</p>
?
{% empty %}
    <p>sorry,no person here</p>
{% endfor %}

if標簽

{% if %}會對一個變量求值，如果它的值是“True”（存在、不為空、且不是boolean類型的false值），對應的內容塊會輸出。

{% if num > 100 %}
    <p>excellent</p>
{% elif num == 100 %}
    <p>beautiful</p>
{% else %}
    <p>nice</p>
{% endif %}
?
也可以只有if和else
{% if user_list|length > 5 %}  <!--結合過濾器來使用-->
  七座豪華SUV
{% else %}
    黃包車
{% endif %}
?
?
1. Django的模板語言不支持連續判斷，即不支持以下寫法：
{% if a > b > c %}
...
{% endif %}

- if語句支持: and 、or、==、>、<、!=、<=、>=、in、not in、is、is not判斷，注意條件兩邊都有空格。

with標簽

- 使用一個簡單地名字緩存一個復雜的變量，多用于給一個復雜的變量起別名，當你需要使用一個“昂貴的”方法（比如訪問數據庫）很多次的時候是非常有用的,注意等號不要加空格
```
# 兩種方式
{% with total=business.employees.count %}
    {{ total }}   
{% endwith %}
?
{% with business.employees.count as total %}
    {{ total }}
{% endwith %}
```

組件

可以將常用的頁面內容如導航條，頁尾信息等組件保存在單獨的文件中，然后在需要使用的地方，文件的任意位置按如下語法導入即可。
```
{% include 'navbar.html' %}
```

有如下導航欄 nva.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .c1{
            background-color: red;
            height: 40px;
        }
    </style>
</head>
<body>
?
<div class="c1">
    <div>
        <a href="">xx</a>
        <a href="">dd</a>
    </div>
</div>
?
</body>
</html>

View Code

嵌入導航欄的頁面，test.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
{% include 'nav.html' %}  導入組件
<h1>xxxxxxxxxx</h1>
</body>
</html>

View Code

組件和插件的簡單區別

組件是提供某一完整功能的模塊，如：編輯器組件，QQ空間提供的關注組件 等。
?
而插件更傾向封閉某一功能方法的函數。
?
這兩者的區別在 Javascript 里區別很小，組件這個名詞用得不多，一般統稱插件

自定義標簽和過濾器

自定義過濾器

- 在settings中的 INSTALL_APPS 配置當前的app,不然Django無法找到自定義的過濾器

- app應用文件夾中創建一個templatetags文件件,必須是這個名字

- templatetags文件夾中創建一個 xx.py 文件,文件名字隨便起

在新建的 xx.py 文件中創建自定義過濾器

from Django import template
?
register = template.Library() # register固定名字,注冊器
?
@register.filter
def oo(v1):    # 不帶參數的過濾器,第一個參數v1是views視圖函數中傳過來的
   s = v1 + 'xxoo'
   return s
?
@register.filter
def oo(v1,v2):  # 帶參數的過濾器
   s = v1 + v2
   return s

使用html文件中的數據

{% load xx %}
{{ values|oo }} -- 無參數
{{ values|oo:'asdf' }} -- 有參數

- 參數最多兩個

自定義標簽

- 　　在settings中的 INSTALL_APPS 配置當前的app,不然Django無法找到自定義的過濾器

- 　　app應用文件夾中創建一個templatetags文件件,必須是這個名字

- 　　templatetags文件夾中創建一個 xx.py 文件,文件名字隨便起

　　在新建的 xx.py 文件中創建自定義過濾器

from Django import template
?
register = template.Library() # register固定名字,注冊器
?
@register.simple_tag
def mytag(v1,v2,v3):   # 第一個參數v1是views視圖函數中傳過來的
    s = v1 + v2 + v3
    return s

使用

{% load xx %}
{% mytag s1 '啦啦' '呵呵' %}  # 直接空格傳參

inclusion_tag : 多用于返回html代碼片段

# views.py
def index(request):
    lis = [11,22,33,44,55,66]
    return render(request,'index.html',{'lis':lis})
?
# index.html
{% load one %}
{% func lis %}
?
# one.py
from django import template
register = template.Library()
@register.inclusion_tag('test.html') # 將test.html里面的內容用下面函數的返回值渲染,然后作為一個組件一樣,加載到使用這個函數的HTML里面
def func(v1):
    return {'data':v1}  # v1 是傳過來的lis列表
?
# test.html
<ul>
    {% for d in data %}
        <li>{{ d }}</li>
    {% endfor %}
</ul>
?
流程: 先執行index函數,將lis傳給index.html,index.html中將lis作為func的參數傳進去,v1=lis,在one.py中,將v1傳給test.html進行渲染,最后將渲染的結果返回給index.html,在頁面顯示出來

View Code

靜態文件

js,css,img 等都叫做靜態文件,那么在關于jango中靜態文件的配置,我們就需要在settings配置文件中寫上下面內容

# 在項目目錄下創建一個文件用來存放靜態文件,通常名稱為 : static
?
STATIC_URL = '/static/'  # 別名
?
STATICFILES_DIRS = [
    os.path.join(BASE_DIR,'static'), # 注意別忘了寫逗號,第二個參數就是項目中你存放靜態文件的文件夾名稱
]

目錄 : 別名也是一種安全機制,瀏覽器上通過調試臺你能看到的是別名的名字,這樣別人就不知道你靜態文件的名字了,不然別人就能通過這個文件夾路徑進行攻擊

前端頁面引入靜態文件的寫法,因為別名也可能會修改,所以使用路徑的時候通過load static來找別名,通過別名映射路徑的方式來獲取靜態文件

{% static %}

{% load static %}
<img src="{% static "images/1.jpg" %}" alt="Hi!" />

引用JS文件時使用

{% load static %}
<script src="{% static "mytest.js" %}"></script>

某個文件多處被用到的可以存為一個變量

{% load static %}
{% static "/images/hi.jpg" as myphoto %}
<img src="{{ myphoto }}"></img>

注意:

一個html文件中寫相對路徑是需要注意一個問題

<form action="/login/"></form>
<img src="/static/1.jpg" alt="">
等標簽需要寫路徑的地方，如果寫的是相對路徑，那么前置的/這個斜杠必須寫上，不然這個請求會拼接當前網頁的路徑來發送請求，就不能匹配我們的后端路徑了

posted @ 2019-07-28 15:58 未來&你好閱讀(234) 評論(0) 收藏舉報

刷新頁面返回頂部

人生苦短,我用python

只有忍受別人不能忍受的忍受,才能享受別人不能享受的享受

Django -- 模板系統

語法

變量

過濾器

標簽Tags

組件

自定義標簽和過濾器

靜態文件

公告