zoukankan      html  css  js  c++  java
  • Django框架之第五篇(模板层) --变量、过滤器(|)、标签(% %)、自定义标签、过滤器、inclusion_tag,模板的继承、模板的注入、静态文件

    模板层

    模板层就是html页面,Django系统中的(template)

    一、视图层(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.方法名}}

     二、模板层变量

    模板语法:分为两大类

    {{变量名}}    变量相关
    {{%  %}}     逻辑相关

    模板变量

    <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>

    三、模板层之过滤器(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 David”|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

     四、模板层之标签 (逻辑相关) {%  %}

    1、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 %}

    2、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 %}

    3、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 %}

    五、自定义标签过滤器

    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是传递的参数)

    六、模板的继承

    当多个页面整体的样式都大差不差的情况下,可以设置一个模板文件,在该母板文件中,使用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标签

    七、模板的导入

    要反复的使用一个组件,可以将该组件写在一个文件中,在使用的时候导入就可以,在模板中使用

    语法

    {% include '模板名字' %}
    {% include 'beautiful.html' %}

    八、静态文件

    在Django框架第二篇中讲到  https://www.cnblogs.com/wangcuican/p/11529943.html

  • 相关阅读:
    推荐一本不错的书《Sencha Ext JS 5 Bootcamp in a Book》
    Libgdx 1.6.0发布,跨平台游戏开发框架
    《.NET最佳实践》与Ext JS/Touch的团队开发
    【翻译】Sencha Cmd中脚本压缩方法之比较
    【翻译】Ext JS 6早期访问版本发布
    【翻译】Ext JS 6有什么新东西?
    SpringBoot 使用 MyBatis 分页插件 PageHelper 进行分页查询
    Spring boot+Thymeleaf+easyui集成:js创建组件页面报错
    SpringBoot多模块搭建,依赖管理
    IDEA在同一窗口导入多个项目
  • 原文地址:https://www.cnblogs.com/wangcuican/p/11569831.html
Copyright © 2011-2022 走看看