장고의 템플릿 시스템

문법

템플릿을 렌더링하기 위해 정보 두 특수 기호 (구문)을 기억해야

{{}}과 {%} %

과 관련된 변수 {{}}, {%%와 관련된 논리}.

변수

{{이름}} 변수 :에서 사용 장고 템플릿 언어 구문을 클릭합니다.

  템플릿 엔진 변수를 만나면 변수를 계산 한 다음, 결과 자체로 대체한다. 명명 된 변수는 숫자를 포함 ( "_") 조합을 강조한다. 변수 이름은 공백이나 구두점을 포함 할 수 없습니다.

  깊이 문의 거점 기호 (.) 템플릿 언어의 특별한 의미를 가지고 있습니다. 템플릿 시스템은 점 ( ".")가 발생하면, 그것은이 주문 문의에있을 것입니다 :

   사전 조회 (사전 검색)
   등록 또는 방법 쿼리 (속성이나 방법 조회)
   디지털 질의 인덱스 (숫자 인덱스 룩업)

주의 사항 :

  1. 계산 결과 값이 호출 될 경우, 매개 변수없이 호출됩니다. 호출의 결과는 템플릿의 값이됩니다.
  2. 변수가 존재하지 않는 경우, 시스템은 기본 설정은 (빈 문자열) ''입니다 값 string_if_invalid 템플릿 옵션을 삽입합니다.

view.py 코드

def index(request):
    import datetime
    s = "hello"
    l = [111, 222, 333]  # 列表
    dic = {"name": "yuan", "age": 18}  # 字典
    date = datetime.date(1993, 5, 2)  # 日期对象

    class Person(object):
        def __init__(self, name):
            self.name = name
        def dream(self):
            return 'dreamer'
    person_yuan = Person("chao")  # 自定义类对象
    person_egon = Person("yantao")
    person_alex = Person("jinxin")

    person_list = [person_yuan, person_egon, person_alex]

    return render(request, "index.html", {"l": l, "dic": dic, "date": date, "person_list": person_list})
    # return render(request,'index.html',locals())
    #locals()获取函数内容所有的变量,然后通过render方法给了index.html文件进行模板渲染,如果你图省事,你可以用它,但是很多多余的变量也被传进去了,效率低

템플릿 지원 표현

<h4>{{s}}</h4>
<h4>列表:{{ l.0 }}</h4>
<h4>列表:{{ l.2 }}</h4>
<h4>字典:{{ dic.name }}</h4>
<h4>日期:{{ date.year }}</h4>

<!--取列表的第1个对象的name属性的值-->
<h4>类对象列表:{{ person_list.0.name }}</h4>
<!--取列表的第1个对象的dream方法的返回值,如果没有返回值,拿到的是none-->
<h4>类对象列表:{{ person_list.0.dream }}</h4>
注意:
    调用对象里面的方法的时候,不需要写括号来执行,并且只能执行不需要传参数的方法,如果你的这个方法需要传参数,那么模板语言不支持,不能帮你渲染

필터

변수의 표시를 변경하기 위해 필터를 사용하여 장고 템플릿 언어.

  필터의 구문은 다음과 같습니다 {{값 | FILTER_NAME : 매개 변수}}

  필터를 적용 | ""파이프 기호를 사용합니다.

  예를 들어 : {{이름 | 낮은}} 다음 변수 이름은 낮은 필터의 적용 후 그 값을 표시합니다. 행동 낮은 여기에 모두 소문자 텍스트입니다.

  주의 사항 :

  1. 필터는 "체인"작업을 지원합니다. 즉, 다른 필터에 대한 입력으로 필터 출력.
  2. 필터는 예를 들어, 매개 변수를 사용할 수 있습니다 : {{SSS | truncatewords : 30}}, SSS의 첫 30 개 단어를 표시 할 것이다.
  3. 필터 매개 변수에 공백이 포함되어, 그것은 따옴표로 포장해야합니다. {|} ','가입 {목록} 이러한 쉼표와 같은 목록의 요소를 연결하는 데 사용되는 공간으로
  4. '|'주위에 공백없이 공백없이 공백은 없다
    length  -- 获取数据长度,没参数 
    返回值的长度,作用于字符串和列表
    {{ value|length }}
    
    default -- 设置默认值
    如果一个变量是false或者为空,使用给定的默认值。 否则,使用变量的值。
    {{ value|default:"nothing"}}
    
    filesizeformat -- 将数字转换成可读的表示
    将值格式化为一个 “人类可读的” 文件尺寸 (例如 '13 KB', '4.1 MB', '102 bytes', 等等)
    {{ value|filesizeformat }}
  
  slice -- 切片
  切片,如果 value="hello world",还有其他可切片的数据类型
  {{value|slice:"2:-1"}}
  
    date -- 时间格式化
  格式化,如果 value=datetime.datetime.now()
  {{ value|date:"Y-m-d H:i:s"}}
  
  safe -- 让标签字符串识别成标签 (脚本攻击--xss)
  很多网站,都会对你提交的内容进行过滤,一些敏感词汇、特殊字符、标签、黄赌毒词汇等等,你一提交内容,人家就会检测你提交的内容,如果包含这些词汇,就不让你提交,其实这也是解决xss攻击的根本途径
  {{ value|safe}}
  
  truncateChars -- 截断字符
  如果字符串字符多于指定的字符数量,那么会被截断。截断的字符串将以可翻译的省略号序列(“...”)结尾。    参数:截断的字符数
  {{ value|truncatechars:9}} #注意:最后那三个省略号也是9个字符里面的,也就是这个9截断出来的是6个字符+3个省略号。
  
  truncateWords -- 截断单词
  在一定数量的字后截断字符串,是截多少个单词。
    例如:‘hello girl hi baby yue ma’,
    {{ value|truncatewords:3}}  #上面例子得到的结果是 'hello girl h1...'
      
    cut -- 移除元素
    移除value中所有的与给出的变量相同的字符串
    {{ value|cut:' ' }}
    
    join -- 拼接
    使用字符串连接列表,就像Python的str.join(list)
    {{ list|join:', ' }}

태그 태그

태그는 다음과 같습니다 {% tag %}. 태그는 변수보다 더 복잡하다 : 추가적인 정보가 출력 텍스트, 숫자에 작성 또는 논리 루프를 통한 유동을 제어하기 위해 몇 가지 변수는 템플릿에 후속로드하는 데 사용된다. 일부 태그는 시작과 끝 태그를 필요로 (예를 들어, {% tag %} ...태그 내용 ... {%의 ENDTAG의 %}).

라벨

각 요소를 통해 : 대한 쓰기 및 자동주기의 탭 키 구조를 생성주기는 더 휴식 아주 기본적인, 너무 간단 사용이되지 않는 등, 복잡한 기능, 당신은 JS를 통과해야

목록을 순회

{% for person in person_list %}
    <p>{{ person.name }}</p>  <!--凡是变量都要用两个大括号括起来-->
{% endfor %}

당신은 사용할 수 있습니다 {% for obj in list reversed %}완료 역주기를.

사전을 순회 :

{% for key,value in d1.items %} 
    {{ forloop.counter }}
      <li>{{ key }} -- {{ value }}</li>
{% endfor %}

루프 다른 방법

forloop.counter            当前循环的索引值(从1开始),forloop是循环器,通过点来使用功能
forloop.counter0           当前循环的索引值(从0开始)
forloop.revcounter         当前循环的倒序索引值(从1开始)
forloop.revcounter0        当前循环的倒序索引值(从0开始)
forloop.first              当前循环是不是第一次循环(布尔值)
forloop.last               当前循环是不是最后一次循环(布尔值)
forloop.parentloop         本层循环的外层循环的对象,再通过上面的几个属性来显示外层循环的计数等

다른 방법 으로서는

示例
    {#  {% for key,value in d1.items %}#}
    {#    {{ forloop.counter }}#}
    {#      <li>{{ key }} -- {{ value }}</li>#}
    {#  {% endfor %}#}

    {#    {% for key,value in d1.items %}#}
    {#    {{ forloop.counter0 }}#}
    {#      <li>{{ key }} -- {{ value }}</li>#}
    {#  {% endfor %}#}

    {#    {% for key,value in d1.items %}#}
    {#      {{ forloop.revcounter }}#}
    {#        <li>{{ key }} -- {{ value }}</li>#}
    {#    {% endfor %}#}

    {#      {% for key,value in d1.items %}#}
    {#        {{ forloop.revcounter0 }}#}
    {#          <li>{{ key }} -- {{ value }}</li>#}
    {#      {% endfor %}#}

    {#      {% for key,value in d1.items %}#}
    {#        {{ forloop.first }}#}
    {#          <li>{{ key }} -- {{ value }}</li>#}
    {#      {% endfor %}#}


    <!-- forloop.parentloop示例 -->
    {#<ul>#}
    {#    {% for dd2 in d2 %}#}
    {#      <li>#}
    {#        {% for ddd2 in dd2 %}#}
    {#          {{ forloop.parentloop.counter }}#}
    {#          {{ forloop.counter }}#}
    {#          <a href="">{{ ddd2 }}</a>#}
    {#        {% endfor %}#}
    {##}
    {#      </li>#}
    {#  {% endfor %}#}
    {#</ul>#}

    <!-- empty示例 -->
    {#<ul>#}
    {#   {% for foo in d3 %}#}
    {#       <li>{{ foo }}</li>#}
    {#   {% empty %}#}
    {#     <li>查询的内容啥也没有</li>#}
    {#  {% endfor %}#}
    {##}
    {#</ul>#}

용 빈

for옵션 레이블을 {% empty %}비우거나 발견되지 않는 순서에 명시된 조항 작업이 될 수있다.

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

{% empty %}
    <p>sorry,no person here</p>
{% endfor %}

라벨의 경우

{% if %}그 값이 (존재하는 빈, 그리고 거짓 부울 값 타입이다) "참"인 경우 블록을 출력 대응하는 내용, 변수 평가가 있습니다.

{% if num > 100 or num < 0 %}
    <p>无效</p>  <!--不满足条件,不会生成这个标签-->
{% elif num > 80 and num < 100 %}
    <p>优秀</p>
{% else %}  <!--也是在if标签结构里面的-->
    <p>凑活吧</p>
{% endif %}

경우에만 및 다른 사람이있을 수 있습니다

{% if user_list|length > 5 %}  <!--结合过滤器来使用-->
  七座豪华SUV
{% else %}
    黄包车
{% endif %}

문, 지원하고, 또는 경우 ==,>, <,! =, <=,> =,이다, 아니다에,에, 판단 양쪽 공간의 조건에주의를 지불하지.

레이블

등호의 주위에 공간을 추가하지 마십시오

{% with total=business.employees.count %}
    {{ total }} <!--只能在with语句体内用-->
{% endwith %}
        或
{% with business.employees.count as total %}
    {{ total }}
{% endwith %}

csrf_token 라벨

우리가 길을 게시 할 양식을 제출하면, 우리는 방어 메커니즘은 상각 할 CSRF 내부의 아 자체가 감액되어서는 안 미들웨어 구성 설정 안에 있지만, 그것을 사용하는 방법을 학습해야하고, 그렇지 않은 기억, 불평 할 것이다 그들의 작업이 forbiden되어 있는지 확인하기 위해이 일을 통해 얻을 수.
    이 레이블로 대체 템플릿을 렌더링 할 때 내부 {%의 csrf_token의 %} 쓸 수있는 위치에,이 것은 (어떤 형태의 양식을 참고) 양식 페이지의 형태로, 크로스 사이트 요청 위조 보호에 사용되는 숨겨진,이 라벨을 폼을 통해 데이터를 전송할 때 값이 제출 된 경우,이 일 또한 제출 된 첫 번째 것은 페이지를 추가하는 렌더링 시간을 우리의 백엔드 임의의 문자열입니다, 그때 당신이 먹는 당신에게 양식을 줄 것이다 우리는 또한이 일의 배경, 당신은 해당 검증을 할 수있는 같은 값의 값을 유지 장고 때문에 내가하지, 당신을 알고의 내용이, 내가 당신에게 토큰을주고, 당신을하지 않는 금이 가게 우리가 나중에 무엇을 배울 가치, 당신은 먼저 사용자가 당신에게 일반 페이지 제출 양식의 데이터를 제공으로 게시 할 수없는 경우, 그냥 이것에 우리 중 하나 패스 사용자와 같이 할 것입니다 알고, 또는 당신은하지 않습니다 나는이 방문 페이지 요청에 가야하지만, 요구는 내가 요청이 불법이라고 말할 수, 아날로그 데이터를 직접 제출 안티 파충류 또는 내 웹 사이트에 악의적 인 공격은 미들웨어 후 우리는이 일에 정교하게, 그러나 지금 당신은 그것을 어떻게 일어 났는지 이해 장고 방어의 집합을 추가 할 이유를 이해한다.

POST 요청 크롤러 간단한 시뮬레이션을 보내기 :

import requests

res = requests.post('http://127.0.0.1:8000/login/',data={
    'username':'chao',
    'password':'123'
})

print(res.text)

주의

{# ... #}

주의 사항

1. Django的模板语言不支持连续判断,即不支持以下写法:
{% if a > b > c %}
...
{% endif %}
2. Django的模板语言中属性的优先级大于方法(了解)
def xx(request):
    d = {"a": 1, "b": 2, "c": 3, "items": "100"}
    return render(request, "xx.html", {"data": d})

템플릿 상속

장고 템플릿 엔진은 상속 템플릿의 가장 강력하고 가장 복잡한 부분이다. 템플릿 상속 사이트의 모든 요소를 ​​포함하는 기본 "골격"템플릿을 만들 수 있습니다, 당신은 이불 블록이 덮여 수있는 템플릿을 정의 할 수 있습니다.

템플릿 상속을 이해하기 쉬운

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="style.css" />
    <title>{% block title %}My amazing site{%/span> endblock %}</title>
</head>

<body>
    <div id="sidebar">
        {% block sidebar %}
        <ul>
            <li><a href="/">Home</a></li>
            <li><a href="/blog/">Blog</a></li>
        </ul>
        {% endblock %}
    </div>

    <div id="content">
        {% block content %}{% endblock %}
    </div>
</body>
</html>

 이 템플릿은, 우리가 그것을 전화 base.html, 그것은 간단한 HTML 골격은 2 페이지 레이아웃에서 사용할 수있는 정의합니다. 그 내용과 "서브 템플릿"작품은 빈 블록을 입력합니다.

 이 예에서는, block태그는 세 콘텐츠 채워진 이불 템플릿 블록을 정의 할 수있다. block템플릿 엔진을 알려주기 : 아이 템플릿은이 위치에서 템플릿을 무시할 수 있습니다.

 아이 템플릿은 다음과 같습니다

{% extends "base.html" %}
 
{% block title %}My amazing blog{% endblock %}
 
{% block content %}
{% for entry in blog_entries %}
    <h2>{{ entry.title }}</h2>
    <p>{{ entry.body }}</p>
{% endfor %}
{% endblock %}

extends태그 여기 열쇠입니다. 그것은이 템플릿이 다른 템플릿을 "상속"템플릿 엔진을 알려줍니다. 시스템이 스텐실 템플릿을 처리 할 때, 첫째, 부모 템플릿을 찾습니다 -이 경우, "base.html"입니다.

那时,模版引擎将注意到 `base.html` 中的三个 `block` 标签,并用子模版中的内容来替换这些block。根据 `blog_entries` 的值,输出可能看起来是这样的:
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="style.css" />
    <title>My amazing blog</title>
</head>
 
<body>
    <div id="sidebar">
        <ul>
            <li><a href="/">Home</a></li>
            <li><a href="/blog/">Blog</a></li>
        </ul>
    </div>
 
    <div id="content">
        <h2>Entry one</h2>
        <p>This is my first entry.</p>
 
        <h2>Entry two</h2>
        <p>This is my second entry.</p>
    </div>
</body>
</html>

가독성을 위해, 당신은 또한 줄 수있는 {% endblock %}태그에게 이름을 .

{% extends "base.html" %}

钩子:{% block title %}
        xxx
    {% endblock %}
钩子:{% block title %}
        xxx
    {% endblock title %}
    
钩子:{% block title %}
        {{ block.super }}  #显示模板内容
        xxx
    {% endblock title %}

 큰 템플릿에서이 방법을 사용하면 명확하게 무엇을 볼 수 있도록하는  {% block %}라벨이 닫힙니다.

동일한 이름의 복수의 템플릿을 정의 할 수없는 block태그.

꾸러미

페이지의 콘텐츠는, 내비게이션과 같은 별도의 파일에 저장 바닥 글 정보 구성 요소를 사용하고 필요한 곳에, 다음 구문에 의해 어느 곳에서나 파일에 도입 할 수있다 사용할 수 있습니다.

{% include 'navbar.html' %}

예를 들어 아래의 탐색 바 nav.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>

페이지, 인 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>

구성 요소와 플러그인의 차이

组件是提供某一完整功能的模块,如:编辑器组件,QQ空间提供的关注组件 等。

而插件更倾向封闭某一功能方法的函数。

这两者的区别在 Javascript 里区别很小,组件这个名词用得不多,一般统称插件。

사용자 정의 태그 및 필터

1, INSTALLED_APPS 앱의 현재 구성 설정에 simple_tag 정의를 찾을 수 그렇지 않으면 할 수없는 장고.

2. (만 templatetags 될 수있는 모듈의 이름)에있는 응용 프로그램 templatetags에서 모듈을 만들고

3, 같은 어떤 평 파일을 만들 : my_tags.py를

from django import template
from django.utils.safestring import mark_safe
 
register = template.Library()   #register的名字是固定的,不可改变
 
 
@register.filter
def filter_multi(v1,v2):
    return  v1 * v2

@register.simple_tag  #和自定义filter类似,只不过接收更灵活的参数,没有个数限制。
def simple_tag_multi(v1,v2):
    return  v1 * v2

@register.simple_tag
def my_input(id,arg):
    result = "<input type='text' id='%s' class='%s' />" %(id,arg,)
    return mark_safe(result)

HTML 파일에서 가져 오기를 사용하기 전에 my_tags.py은에서 만든 simple_tag 및 필터를 정의

{% load my_tags %} 

사용 simple_tag 및 필터 (호출하는 방법)

-------------------------------.html
{% load xxx %}  
      
# num=12
{{ num|filter_multi:2 }} #24
 
{{ num|filter_multi:"[22,333,4444]" }}
 
{% simple_tag_multi 2 5 %}  参数不限,但不能放在if for语句中
{% simple_tag_multi num 5 %}

참고 : 필터는 다른 문에 나중에 경우에 사용할 수 없습니다 simple_tag

{% if num|filter_multi:30 > 100 %}
    {{ num|filter_multi:30 }}
{% endif %}

일 (57)

自定义过滤器

1. app应用文件夹中创建一个templatetags文件件,必须是这个名字
2. templatetags文件夹中创建一个 xx.py文件,文件名字随便起

3. 创建自定义过滤器
    from django import template

    register = template.Library()  #register固定的名字,注册器

    # @register.filter
    # def oo(v1,v2):  #不带参数的过滤器
    #     s = v1 + 'xxoo'

    #     return s

    @register.filter
    def oo(v1,v2):  #带参数的过滤器
        s = v1 + v2
        return s
    
4. 使用  html文件中  {% load 文件名 %} 
     {% load xx %}
    {{ values|oo }} -- 无参数
    {{ values|oo:'asdf' }} -- 有参数

5. 注意:参数最多两个


自定义标签
1. app应用文件夹中创建一个templatetags文件件,必须是这个名字
2. templatetags文件夹中创建一个 xx.py文件,文件名字随便起
3. 创建自定义标签
    @register.simple_tag
    def mytag(v1,v2,v3):  
        s = v1 + '和B哥' + v2 + v3
        return s

4.使用
    {% load xx %}
    {% mytag s1 '和相玺' '和大壮' %}  
5. #可以传多个参数

inclusion_tag

반환 멀티 HTML 코드 세그먼트

1. app应用文件夹中创建一个templatetags文件件,必须是这个名字
2. templatetags文件夹中创建一个 xx.py文件,文件名字随便起
3. 创建自定义inclusion_tag
    @register.inclusion_tag('inclusiontag.html')
    def func(v1):
            return {'oo':v1}

4. func的return数据,传给了inclusiontag.html,作为模板渲染的数据,将inclusiontag.html渲染好之后,作为一个组件,生成到调用这个func的地方
5. 使用
    {% load xx %}
    {% func l1 %}

templatetags / my_inclusion.py

from django import template

register = template.Library()


@register.inclusion_tag('result.html')  #将result.html里面的内容用下面函数的返回值渲染,然后作为一个组件一样,加载到使用这个函数的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}#这里可以穿多个值,和render的感觉是一样的{'data1':data1,'data2':data2....}

템플릿 / 조각 / result.html

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

템플릿 / index.html을

<!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>inclusion_tag test</title>
</head>
<body>

{% load inclusion_tag_test %}

{% show_results 10 %}  
</body>
</html>

정적 관련 파일

 JS, CSS, 그래서 IMG와 장고 정적 파일에 다음 구성, 정적 파일이라고합니다, 우리는이에 대한 내용을 작성하는 구성 파일 설정을 작성해야합니다 :

1 在项目中创建一个文件夹,比如叫jingtaiwenjian

# STATIC_URL = '/xxx/' #别名,随便写名字,但是如果你改名字,别忘了前面页面里面如果你是通过/xxx/bootstrap.css的时候,如果这里的别名你改成了/static/的话,你前端页面的路径要改成/static/bootstrap.css。所以我们都是用下面的load static的方式来使用静态文件路径
2 STATIC_URL = '/static/' #别名

3 STATICFILES_DIRS = [
    os.path.join(BASE_DIR,'jingtaiwenjian'), #注意别忘了写逗号,第二个参数就是项目中你存放静态文件的文件夹名称
]

디렉토리 : 별칭은 다른 사람이 정적 폴더의 이름을 알 수 없다, 그렇지 않으면 다른 사람이 폴더 경로를 통해 공격 할 수 있도록 볼 수있는 시운전 단계를 통해 브라우저에 안전 메커니즘은 별칭 이름입니다.

  IMG

프론트 페이지 소개 별칭도 수정 될 수 있기 때문에, 정적 파일을 작성, 그래서 별명 매핑의 방법으로 정적 파일 경로를 얻기 위해, 정적 별칭 부하를 통해 경로를 찾기 위해 시간을 사용

IMG

{% 정적 %}

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

  JS 파일을 참조 할 때 사용합니다 :

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

   파일에 사용 된 대부분의 변수로 저장할 수 있습니다

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

{%의 get_static_prefix의 %}

{% 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!" />

추천

출처www.cnblogs.com/shuai-jie/p/11228328.html