返回顶部

django的模版

django的模版

 

 

 

1模版语法

 views.py 书写方式

 

def index(request):

    '''
    模版语法分:

    变量: {{ }}
        1. 深度查询   句点符
        2. 过滤器     {{val|filter_name:参数}}

    标签: {%  %}

    '''

    name = "augustyang"
    test_list = [11,22,33,44]

    class people:
        def __init__(self,name,age):
            self.name = name
            self.age = age

    p1 = people("yy",18)
    p2 = people("ss",28)

    people_list = [p1,p2]

    # return render(request, "index.html",{"name":name})
    return render(request, "index.html",locals())

 

 

 

 

 

'''
用到的知识有:
    引用方式:
        {"name":name} 指定引用
        locals()    相当于全部引用  
          
            render(request, "index.html",{"name":name,"p1":p1})
        
    index.html 文件 调用方式
    
        1. 深度查询   句点符
        
        <p> {{ name }}</p>
        <p> {{ p1 }}</p>
        <p> {{ p1.name }}</p>
        <p> {{ test_list.1 }}</p>
        <p> {{ people_list.1.name }}</p>
    
'''

 

   index.html 书写方式

 

        <p> {{ name }}</p>
        <p> {{ p1 }}</p>
        <p> {{ p1.name }}</p>
        <p> {{ test_list.1 }}</p>
        <p> {{ people_list.1.name }}</p>

 

 

 

 

2过滤器

 views.py 书写方式

def index(request):
  
    ysl = 22# 过滤器
    import datetime
    now = datetime.datetime.now()
    file_size = 12343242123123

    content = "南京出台人才购房新政,全市所有在售房源向海内外人才全开放,并为人才购房开辟优先通道,该政策将于2020年1月1日起施行。据中新经纬客户端不完全统计"

    link = "<a href=''>click</a>"

    return render(request, "index.html",locals())

 

 

 

  index.html 书写方式

    <!-- 过滤器 -->
    <h2>过滤器</h2>

    <!-- date  -->
    <p>{{ now|date:"Y-m-d " }}</p> 

    <!-- length 返回列表和字符串长度-->
    <p>{{ test_list|length }}</p> 

    <!-- filesizeformat  11.2 TB-->
    <p>{{ file_size|filesizeformat }}</p>

    <!-- default  为空使用默认值  否则使用变量值-->
    <p>{{ ysl|default:"没有这个值" }}</p>

    <!-- default  为空使用默认值  否则使用变量值-->
    <p>{{ link|safe }}</p>

    <!-- 要截断的字符数 -->
    <p>{{ content|truncatechars:10 }}</p>

 

 

 

 

 

3标签

 标签 有for循环    if 循环  with as 重命名

 

①for标签

{% for foo in test_list %}
    <p>{{ foo }}</p>
{% endfor  test_list%}

{% for foo in people_list %}
    <p>{{ foo.name }}</p>
{% endfor   people_list %}


<!-- 字典遍历-->
{% for key,val in dic.items %}
    <p>{{ key }}:{{ val }}</p>
{% endfor %}


{% for key in dic %}
    <p>{{ key }}</p>
{% endfor %}



{% for people in people_list %}
    <p>{{ people }}</p>
{% endfor %}

 

 

 ②if 标签

{% if user %}
    <p>
        <a href="">hi {{ user }}</a>
        <a href="">注销</a>
    </p>
{% else %}
    <p>
        <a href=" ">登录</a>
        <a href=" ">注册</a>
    </p>

{% endif %}

 

 

③with标签

{% with people_list.1.name as n  %}
<p>{{ n }}</p>
<p>{{ n }}</p>
{% endwith %}

 

 

④ csrf_token

在form表单点击提交按钮后,会出现Forbidden:CSRF verification failed. Request aborted,解决方法两种

方法一:在settings.py中注释掉 'django.middleware.csrf.CsrfViewMiddleware',

方法二:在form表单中 添加这个模板语言

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form method="post" action="">
       name: <input type="text" name="user" >
            <input type="submit" name="">
         {% csrf_token %}
    </form>
</body>
</html>

 

 

4自定义标签和过滤器

 

前提

1 在APP中新建一个包 templatetags 必须是这个名字

2 新建一个py文件 my_tag_filter.py

3.在my_tag_filter.py 文件中

from django import template
register=template.Library()


@register.filter
def multi_fliter(x,y):

    return x*y


@register.simple_tag
def multi_tag(x,y):

    return x*y

 

 

 2. 使用

<h2>自定义标签和过滤器</h2>
{% load my_tag_filter %}


<p>{{ ysl|multi_fliter:20 }}</p>

<p>{% multi_tag 7 8 %}</p>

{% if ysl|multi_fliter:22 > 100 %}
    <p>100</p>
{% else %}
    <p>{{ ysl }}</p>
{% endif %}

{#{% if  multi_tag ysl 20 >100 %}#}
{#<p>100</p>#}
{#{% else %}#}
{#<p>{{ ysl }}</p>#}
{#{% endif %}#}

<!-- filter可以用在if等语句,simple_tag不可以   -->

 

 需要先引用

{% load my_tag_filter %}
filter可以用在if等语句,simple_tag不可以 

 

 

5模版继承

 

1引用bootstrap,jquery

①在工程下新建一个包  一般叫static   

  

 

 

 

②配置路径

# static 是静态文件的别名
STATIC_URL = '/static/'


# 配置 静态文件
STATICFILES_DIRS=[
    os.path.join(BASE_DIR,"static"),
]

 

 

③重启 django 加载配置

 

<link rel="stylesheet" type="text/css" href="/static/bootstrap-3.3.7/css/bootstrap.css">

<script type="text/javascript" src="/static/jquery-3.4.1.js"></script>

 

 

2. 模版继承样例

 

advertise.html

<div class="panel panel-danger">
    <div class="panel-heading">Panel heading without title</div>
    <div class="panel-body">
        11111
    </div>
</div>

<div class="panel panel-success">
    <div class="panel-heading">Panel heading without title</div>
    <div class="panel-body">
        3333
    </div>
</div>

<div class="panel panel-info">
    <div class="panel-heading">Panel heading without title</div>
    <div class="panel-body">
        555555
    </div>
</div>

 

 

 

base.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">

    <!-- 标题模版-->
    {% block title %}
        <title>base</title>
    {% endblock %}

    <link rel="stylesheet" type="text/css" href="/static/bootstrap-3.3.7/css/bootstrap.css">
    <style>

        .header {
            width: 100%;
            height: 50px;
            background-color: #369;
        }
    </style>
    <script type="text/javascript" src="/static/jquery-3.4.1.js"></script>

</head>
<body>
<div class="header"></div>
<div class="container">
    <div class="row" style="margin-top: 50px;">
        <div class="col-lg-4  col-mg-4">

            <!-- 继承 另一个模版    -->
            {% include 'advertise.html' %}


        </div>
        <div class="col-lg-8  col-mg-8">

            <!-- 内容模版 自己改写 -->
            {% block con %}
                <h4>content</h4>
            {% endblock %}

        </div>
    </div>
</div>
</body>
</html>

 

 

 

auth.html

{% extends 'base.html' %}


{% block title %}
<title>auth</title>
{% endblock %}


{% block con %}


{#{{ block.super }}#}

<h4>login</h4>
<h4>login</h4>

{% endblock con%}

 

 

index.html

{% extends "base.html" %}

{% block title %}
<title>index</title>
{% endblock %}


{% block con %}

{#    <p> {{ name }}</p>#}
{#    <p> {{ p1 }}</p>#}
{#    <p> {{ p1.name }}</p>#}
{#    <p> {{ test_list.1 }}</p>#}
{#    <p> {{ people_list.1.name }}</p>#}


    <!-- 过滤器 -->
    <h2>过滤器</h2>

    <!-- date  -->
    <p>{{ now|date:"Y-m-d " }}</p> 

    <!-- length 返回列表和字符串长度-->
    <p>{{ test_list|length }}</p> 

    <!-- filesizeformat  11.2 TB-->
    <p>{{ file_size|filesizeformat }}</p>

    <!-- default  为空使用默认值  否则使用变量值-->
    <p>{{ ysl|default:"没有这个值" }}</p>

    <!-- default  为空使用默认值  否则使用变量值-->
    <p>{{ link|safe }}</p>

    <!-- 要截断的字符数 -->
    <p>{{ content|truncatechars:10 }}</p>


<!-- 标签 -->
<h2>标签</h2>

{% for foo in test_list %}
    <p>{{ foo }}</p>
{% endfor  test_list%}

{% for foo in people_list %}
    <p>{{ foo.name }}</p>
{% endfor   people_list %}


<!-- 字典遍历-->
{% for key,val in dic.items %}
    <p>{{ key }}:{{ val }}</p>
{% endfor %}


{% for key in dic %}
    <p>{{ key }}</p>
{% endfor %}



{% for people in people_list %}
    <p>{{ people }}</p>
{% endfor %}


<hr>

{% if user %}
    <p>
        <a href="">hi {{ user }}</a>
        <a href="">注销</a>
    </p>
{% else %}
    <p>
        <a href=" ">登录</a>
        <a href=" ">注册</a>
    </p>

{% endif %}

{% with people_list.1.name as n  %}
<p>{{ n }}</p>
<p>{{ n }}</p>
{% endwith %}

<hr>
<h2>自定义标签和过滤器</h2>
{% load my_tag_filter %}


<p>{{ ysl|multi_fliter:20 }}</p>

<p>{% multi_tag 7 8 %}</p>

{% if ysl|multi_fliter:22 > 100 %}
    <p>100</p>
{% else %}
    <p>{{ ysl }}</p>
{% endif %}

{#{% if  multi_tag ysl 20 >100 %}#}
{#<p>100</p>#}
{#{% else %}#}
{#<p>{{ ysl }}</p>#}
{#{% endif %}#}

<!-- filter可以用在if等语句,simple_tag不可以   -->

{% endblock %}
View Code

 

 

需要注意项:

1  如果你在模版中使用 {% extends %} 标签,它必须是模版中的第一个标签。其他的任何情况下,模版继承都将无法工作。

2  在base模版中设置越多的 {% block %} 标签越好。请记住,子模版不必定义全部父模版中的blocks,所以,你可以在大多数blocks中填充合理的默认内容,然后,只定义你需要的那一个。多一点钩子总比少一点好。

3   如果你发现你自己在大量的模版中复制内容,那可能意味着你应该把内容移动到父模版中的一个 {% block %} 中。

4   为了更好的可读性,你也可以给你的 {% endblock %} 标签一个 名字 。例如:

{% block content %}

...

{% endblock content %}

 

  

 

 

 

posted on 2019-11-08 14:58  augustyang  阅读(142)  评论(0编辑  收藏  举报

导航