10、 Django-模板-templates

 

模板语法

#模板中的变量
    语法:{{ var }}
    如果变量不存在、则插入空字符串
    
#方法不能有参数
    {{ int }}
    {{ str }}
    {{ list }}
    {{ list.0 }}
    {{ dict }}
    {{ dict.a }}        #dict['a']
    {{ func }}          #传递函数
    {{ class_obj.func }}    #传递类.方法

#列表、使用索引、不允许负索引
    items= ['apples', 'banans', 'carrots']
    {{ items.2 }}
 
#模板中的标签:
    if、for、while.......
    语法:{% tag %}
    作用:
        1、加载外部传入的变量
        2、在输出中创建问基本
        3、控制循环或逻辑
        
#if语句
    #if单分支:
    {% if 表达式 %}
        语句
    {% endif %}
    
    #if双分支
    {% if 表达式 %}
        语句
    {% else %}
        语句
    {% endif %}
    
    #if多分枝
    {% if 表达式 %}
        语句
    {% elif 表达式 %}
        语句
    {% else %}
        语句
    {% endif %}
    
    #判断语句:true   false
    {% if today_is_weekend %}
        <p>为true输出的内容</p>
    {% endif %}
    
    #使用and  or   not
    {% if a and b %}
    {% if a or b %}
    {% if not list %}
    
    
    #使用in  和  not in
    {% if "bc" in "abcdef" %}
        <p>输出bc在abcdef中</p>
    {% endif %}
    
    {% if "gh" not in "abcdef" %}
        <p>输出gh不在abcdef中</p>
    {% endif %}

 

for循环

for语句:
{% for 变量 in 列表 %}
    语句
{% empty %}        #当列表为空时执行empty后面的语句
    语句
{% endfor %}


#表示当前时第几次循环 :{{ forloop.counter }}
{% for item in todo_list %}
    <p>{{ forloop.counter }}:{{ item }}</p>     
{% endfor %}

注意:
{{ forloop.counter0 }}    #表示当前时第几次循环,从0开始数
{{ forloop.revcounter }}    #表示当前时第几次循环,倒着数数、到1停
{{ forloop.revcounter0 }}    #表示当前时第几次循环,倒着数数、到0停
{{ forloop.first }}            #是否是第一次循环  返回布尔值
{{ forloop.last }}            #是否最后一次循环  返回布尔值

如:
{% for link in links %}
    {{ link }}{{ %if not in forloop.last %}} | {% endif %}    
{% endfor %}

 

注释

#单行注释
{# 注释的内容 #}
    
    
#多行注释
{% comment %}
    注释的内容
{% endcomment %}
    

 

过滤器

#语法
{{ var|过滤器 }}    #作用:在变量显示前修改

add{{ value|add:2 }}    #变量+2
add{{ value|add:-2 }}    #没有减法的过滤去、但可以加负数

{{ name|lower }}        #将字符串换成小写
{{ my_list|first|upper }}    #将列表中的第一个值标为大写

{{ bio|truncatechars:30}}    #截断、将字符串截断30个字符

#过滤器可以传递参数、参数需要使用引号括起来
如:{{ students|join:'=' }}

#默认值default
{{ var|default:value }}    #如果变量没有被提供或者为false、空、会默认使用默认值

#根据指定格式转换日期为字符串、处理时间的就是针对date进行的转换
{{ dateVal|date:'y-m-d' }}        #将日期对象dateVal转换为指定的日期格式

 

html的转义

#将接收到的数据当成普通字符串处理还是当成HTML代码来渲染的问题

#如渲染成html
{{ code|safe }}

#关闭自动转义
{% autoescape off%}
    code
{% endautoescape %}

#打开自动转义
{% autoescape no%}
    code
{% endautoescape %}

 

模板的继承

block:
    {% block XXX%}
        code
    {% endblock %}
    
    
extends继承、写在开头位置
    {% extends '父模板路径' %}
    

include:加载模板进行渲染
    {% include '模板文件' %}
    
    
{{ block.super }}    #获取父模板中block中的内容

 

案例:

views.py

from django.shortcuts import render

def index(request):
    data = {
        'name': 'xiaoxin',
        'age': 25,
        'likes': ['movie', 'game', 'code'],
        'address': {'city': '深圳', 'province': '广东'},
        'stars': [
            ['黄师傅', '啊尧','温工'],
            ['番薯', '柱子', '小赵'],
            ['捷顺', '速通4', '道闸'],
        ]
    }
    
    return render(request, 'index.html', data)        #使用render(request, html文件名, 传递的数据)  将数据传递给html模板

 

根路由:urls.py

from django.contrib import admin
from django.urls import path
from App_templates.views import *

urlpatterns = [

    path('index/', index),

    path('admin/', admin.site.urls),
]

 

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
</head>
<body>  
    <h2>首页</h2>
    <hr>

    {# 单行注释 #}
    {% comment %}
        多行注释
    {% endcomment %}

{# 打印变量 #}
    <p>name: {{ name }}</p>
    <p>age: {{ age }}</p>
    
{#  取列表的值 需要  列表.下标  #}
    <p>likes: {{ likes }}</p>
    <p>likes.2: {{ likes.2 }}</p>   
    
{#  取字典的value需要    字典.key  #}
    <p>address: {{ address }}</p>
    <p>address: {{ address.city }}</p>
    <hr>

{#   标签的使用   #}
    <h3>if语句</h3>
    <h4>单分支</h4>
    {# 这里的  >= 符号两边需要有空格不然语法会报错   #}
    {% if age >= 18 %}
    	<p>{{ name }} 已成年</p>
    {% endif %} 

    <h4>双分支</h4>
    {% if age >= 18 %}
    	<p>{{ name }} 已成年</p>
    {% else %} 
        <p>{{ name }} 未成年</p>
    {% endif %}
    
    <h4>多分支</h4>
    {% if age < 18 %}
    	<p>{{ name }} 未成年</p>
    {% elif age < 60 %}
        <p>{{ name }} 是猛男</p>
    {%  else %}
        <p>{{ name }} 是老年人</p>
    {% endif %} 

    <h4>结合运算符 and、or、in、not in、not等等</h4>
    {% if age > 18 and age < 60 %}
    	<p>{{ name }} 是成年</p>
    {% endif %}

    <hr>
    <h3>for循环</h3>
    {% for like in likes %}
    	<p>{{ like }}</p>
    {% endfor %}
    
    <h4>empty</h4>
    {% for like in likes2 %}
    	<p>{{ like }}</p>
    {% empty %}
        <p>likes2 为空或者不存在</p>
    {% endfor %}
    
    <h4>下标</h4>
    {% for like in likes %}
    	<p>
            counter0:{{ forloop.counter0 }},
            counter:{{ forloop.counter }},
            revconuter0:{{ forloop.revcounter0 }},
            revcounter:{{ forloop.revcounter }},
        
            {#  在第一次循环的后面 加上 -first #}
            {% if forloop.first %}      
            	<b>- first</b>
            {% endif %} 
            {#  在最后一次循环的后面 加上 -last #}
            {% if forloop.last %}
            	<b>- last</b>
            {% endif %} 
        </p>
    {% endfor %}
    

    <h4>循环嵌套</h4>
    {#  表格标签  border="1":表格线宽、 width:表格宽度#}
    <table border="1" width="300">    
        {% for star in stars %}
        	<tr>
            
                {% for s in star %}
                	<td>
                        {{ s }}-
                        {{ forloop.parentloop.counter }}-   {# 拿到当前循环的上一个循环体的值 #}
                        {{ forloop.counter }}           {# 拿到当前循环体的值 #}
                    </td>
                {% endfor %}
            
            </tr>
        {% endfor %}
    </table>

    <h3>过滤器</h3>
    <h4>数字加减</h4>
    <p>age = {{ age }}</p>
    <p>age | add:2= {{ age|add:2 }}</p>
    <p>age | add:-2 =  {{ age|add:-2 }}</p>

    <h4>字符大小写转换</h4>
    <p>name = {{ name }}</p>
    <p>name|first|upper = {{ name|first|upper }}</p>
    <p>name|last|upper = {{ name|last|upper }}</p>
    <p>name|title = {{ name|title }}</p>        {# 标题:将第一个字符换成大写 #}
    
    <h4>截断</h4>
    <p>name|truncatechars:4 = {{ name|truncatechars:4 }}</p>    {# 截取字符串前4-1个字符 #}
    
    <h4>拼接 join</h4>
    <p>likes = {{ likes }}</p>
    <p>likes|join:'+' = {{ likes|join:'+' }}</p>    {# 将列表中的元素使用 + 号拼接起来 #}

    <h4>default:默认值 前提是变量为空没有值</h4>
    <p>likes2 = {{ likes2 }}</p>    {# 这里的likes2 是空值没有定义 #}
    <p>linkes2|default:'xjxj' = {{ likes2|default:'xjj' }}</p>
    
    <h4>指定日期格式</h4>
    <p>dt = {{ dt }}</p>
    <p>dt = {{ dt|date:'Y-m-d' }}</p>
    <hr>

    <h4>html转义</h4>
    <p>code = {{ code }}</p>    {# 输出没有转义前的 #}
    <p>code = {{ code|safe }}</p>   {# 输出转义后的html格式 、就是去掉html的标签、只输出字符串 #}
    <hr>
    <h4>自动转义</h4>
    <p>{# 打开自动转义 #}</p>
    {% autoescape off%}         {# 打开自动转义 #}
        {{ code }}
    {% endautoescape %}
    
    <p>{# 关闭自动转义 #}</p>
    {% autoescape on%}         {# 关闭自动转义 #}
        {{ code }}
    {% endautoescape %}
</body>
</html>

 

 

模板的继承

views.py

#模板继承、子模板继承父模板

#父模板
def base(request):
    return render(request, 'base.html')

#字模板
def music(request):
    return render(request, 'music.html')

#子模板
def sport(request):
    return render(request, 'sport.html')

urls.py

from django.contrib import admin
from django.urls import path
from App_templates.views import *

urlpatterns = [


    path('base_index/', base),
    path('music_index/', music),
    path('sport_index/', sport),
]

base.html  --父模板

<!DOCTYPE html>
<html lang="en">
<head>

    <!-- meta:设置编码 -->
    <meta charset="UTF-8">
    <!-- title:标题  block:块  endblock:结束块-->
    {% block mytitle %}
    <title>主页</title>
    {% endblock %}

</head>
<body>

    <!-- a:链接  href=urls中的路由-->
    <a href="/music_index">音乐频道</a>
    <a href="/sport_index">体育频道</a>
    <br>

    <!-- block:块  endblock:结束块 这个是被子模板继承后可以修改的地方-->
    {% block info %}
        这是主页
    {% endblock %}
    <br>

    <h3>有任何问题联系xxxxx</h3>


</body>
</html>

 字模板-music.html


<!-- 直接继承父模板 base.html -->
{% extends 'base.html' %}

<!-- block:块 修改父模板中block块中的内容  重写-->
{% block mytitle %}
    <title>音乐频道</title>
{% endblock %}

{% block info %}
    欢迎来到音乐频道
{% endblock %}

子模板- sport.html


<!-- 直接继承父模板 base.html -->
{% extends 'base.html' %}

<!-- block:块 修改父模板中block块中的内容  重写-->
{% block mytitle %}
    <title>体育频道</title>
{% endblock %}

{% block info %}
    欢迎来到体育频道
{% endblock %}

 

posted @ 2024-07-01 22:32  little小新  阅读(4)  评论(0编辑  收藏  举报