常用語法

{{  }}和 {% %}

    變量相關的用 --> {{ ... }}
    邏輯相關的用 --> {% ... %}

變量

{{ name }}    

for循環

for...in

{% for .. in .. %}
    ...
{% endfor %}

for...in...empty

{% for .. in .. %}
    ...
{% empty %}
    ...            # 如果for循環沒有數據,則執行這裏的代碼
{% endfor %}

遍歷字典

{% for k,v in dic.items %}
    {{ k }-{{ v }}
{% endfor %}
 

forloop.counter        當前循環的索引值（從1開始）
forloop.counter0    當前循環的索引值（從0開始）
forloop.revcounter    當前循環的倒序索引值（從1開始）
forloop.revcounter0    當前循環的倒序索引值（從0開始）
forloop.first        當前循環是不是第一次循環（布爾值）
forloop.last        當前循環是不是最後一次循環（布爾值）
forloop.parentloop    本層循環的外層循環

if判斷

Django不支持連續判斷,如:a>b>c

條件支持: and 、or、==、>、<、!=、<=、>=、in、not in、is、is not

if...else

{% if 條件 %}
    ...
{% else %}
    ...
{% endif %}

if...elif...else

{% if 條件1 %}
    ...
{% elif 條件2 %}
    ...
{% else %}
    ...
{% endif %}

with聲明變量

{% with name=name_lsit.2.1.1 %}
    {{ name }}
{% endwith %}

filter方法

內置的filter方法

語法:

值|方法:參數

default            如果一個變量是false或者為空，使用給定的默認值。 否則，使用變量的值。
length            返回值的長度，作用於字符串和列表
filesizeformat    將值格式化為一個 “人類可讀的” 文件尺寸 （例如 ‘13 KB‘, ‘4.1 MB‘, ‘102 bytes‘, 等等）
slice            切片
date            格式化
safe            可以渲染html標簽, 把value當成安裝的代碼
truncatechars    顯示指定的指定的字符數量,並且最後為 ...
truncatewords    在一定數量的字後截斷字符串
cut                移除value中所有的與給出的變量相同的字符串
join            使用字符串連接列表，例如Python的str.join(list)
timesince
timeuntil

{{ value|default:"nothing"}}    # 如果value沒有傳值或者值為空的話就顯示nothing
{{ value|length }}                # 返回value的長度，如 value=[‘a‘, ‘b‘, ‘c‘, ‘d‘]的話，就顯示4.
{{ value|filesizeformat }}        # 如果 value 是 123456789，輸出將會是 117.7 MB。

自定義的filter方法

文件路徑

app01/
    __init__.py
    models.py
    templatetags/              # 在app01下面新建一個package package
        __init__.py
        app01_filters.py      # 建一個存放自定義filter的文件
    views.py

自定義filter

from django import template
register = template.Library()


@register.filter(name="cut")
def cut(value, arg):                    # 不傳參
    return value.replace(arg, "")


@register.filter(name="addSB")            # 一個參數
def add_sb(value):
    return "{} SB".format(value)

{# 先導入我們自定義filter那個文件 #}
{% load app01_filters %}

{# 使用我們自定義的filter #}
{{ somevariable|cut:"0" }}
{{ d.name|addSB }}

{# simple tag #}
{% plus "1" "2" "abc" %}

自定義simpletag

和自定義filter類似，只不過接收更靈活的參數

from django import template
register = template.Library()

@register.simple_tag(name="plus")        # 參數大於2
def plus(a, b, c):
    return "{} + {} + {}".format(a, b, c)

{% load app01_demo %}

{# simple tag #}
{% plus "1" "2" "abc" %}

自定義的inclusion_tag

多用於返回html代碼片段

from django import template

register = template.Library()


@register.inclusion_tag(‘result.html‘)
def show_results(n):
    n = 1 if n < 1 else int(n)
    data = ["第{}項".format(i) for i in range(1, n+1)]
    return {"data": data}

<ul>
  {% for choice in data %}
    <li>{{ choice }}</li>
  {% endfor %}
</ul>

{% load inclusion_tag_test %}            # 加載
{% show_results 10 %}            # 調用   

母版和繼承

為什麽要有母版

把多個頁面公用部分提取出來,放在一個母版裏面
其他頁面只需要 繼承 母版就可以了

母版裏的塊(占位)

{% block page-main %}
{% endblock %}

繼承母版

{% extends ‘base.html‘ %}    // 繼承母版 

{% block page-main %}
    ...                        // 自定義的內容, 會取base.html裏填充寫好對應的塊(占位好的位置)
{% endblock %}

具體使用步驟

1, 把公用的html部分提取出來,放到base.html文件中
2, 在base.html中,通過定義block,把每個頁面不同的地方區別出來
3, 在具體的頁面中,先繼承母版
4, 通過block名去替換指定的母版中塊的位置

註意事項

1, {% extends ‘base.html‘ %} 放在子頁面的第一行,base.html必須加引號
2, 可以在base.html中定義很多block,通常我們會額外定義一個page-css和page-js兩個塊
3, views.py 相應的函數返回對應的 子頁面

組件

語法

{% include ‘nav.html‘ %}    // 相當在本html文件裏寫了‘nav.html‘裏的內容

註意事項

在繼承了母版的頁面引用組件, 要寫在塊(block)裏面

靜態文件

第一種方式

{% load static %}                                        # 去setting.py裏面找靜態文件夾的別名
<img src="{% static "images/hi.jpg" %}" alt="Hi!" />    # 將別名與後面的路徑拼接成完成的路徑

或者

給靜態文件起(as)一個別名

{% load static %}                        # 導入
{% static "images/hi.jpg" as myphoto %}    # 起別名
<img src="{{ myphoto }}"></img>            # 引用

第二種方式

使用get_static_prefix

{% get_static_prefix %}　　--> 相當於 /static/　　(動態版的別名)

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

或者

{% load static %}
{% get_static_prefix as STATIC_PREFIX %}

<img src="{{ STATIC_PREFIX }}images/hi.jpg" alt="Hi!" />
<img src="{{ STATIC_PREFIX }}images/hi2.jpg" alt="Hello!" />

Django進階-模板系統