系统管理►python实战

templates基本使用

templates

变量

语法格式

1
{{ var_name }}

变量过滤器 (filter)

语法格式

1
{{ obj|filter:param }}

常用的内置过滤器
  • add 给变量加上相应的值
  • addslashes 给变量中的引号前加上斜线
  • capfirst 首字母大写
  • cut 从字符串中移除指定的字符
  • date 格式化日期字符串
  • default 如果值是False,就替换成设置的默认值，否则就是用本来的值
  • default_if_none 如果值是None，就替换成设置的默认值，否则就使用本来的值
实例

views.py定义日期变量

1
2
3
test = 'te st'
import datetime
d = datetime.datetime.now()

login.html 使用

1
2
{{ test | cut:' ' }}
{{ d|date:'Y-m-d' }}

标签

语法格式

1
{%tags%}

  • if

    1
    {%if%}	{%endif%}

  • for

    1
    {%for%}	{%endfor%}
实例
1
2
3
4
5
6
7
8
{% for item in obj_li %}
    <div>
        {% if item.username == 'test' %}
            <span>{{ item.username }}</span>
            <span>{{ item.password }}</span>
        {% endif %}
    </div>
{% endfor %}

其实现的效果和 python 中的 if 和 for 效果类似。

自定义标签

内置方法无法满足需求，可以通过自定义过滤器和标签方式满足需求。

  1. 应用 demo 中新建 package ，名称为 templatetags。

  2. 新建 python 文件，可任意命名(my_tag.py 示例)

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    from django.template import library

    register = library()    # 必须实例化，对象名称为 register


    @register.filter
    def filter_func(x,y):
        return x+y

    @register.simple_tag
    def simple_tag(t):
        return '2018-08-18'

  3. 在项目 settings.py 的 INSTALL_APPS 添加对应的应用名称(已注册不需要添加)

    1
    2
    3
    4
    5
    6
    7
    8
    9
    INSTALLED_APPS = [
        'django.contrib.admin',
        'django.contrib.auth',
        'django.contrib.contenttypes',
        'django.contrib.sessions',
        'django.contrib.messages',
        'django.contrib.staticfiles',
        'demo.apps.DemoConfig',
    ]

  4. 在 login.html 文件中引入

    1
    2
    3
    4
    {% load my_tag %}
    <p>{{ test | filter_func:'666' }}</p>   # 自定义过滤器

    {% filter_tag 'a' 'b' 'c' 'd' %}    # 自定义标签
引入静态文件

引入 jquery 为示例

  1. 在应用 demo 中新建 static/js 文件夹，放入对应的文件

  2. 在项目的 settings.py 文件中添加

    1
    2
    3
    4
    STATICFILES_DIRS = (
        os.path.join(BASE_DIR, "demo/static/"), # 注意逗号
        # [os.path.join(BASE_DIR, "static/")]   
    )

  3. 在 demo/login.html 文件中添加

1
{% load staticfiles %}

注意：添加在 html 页面顶部

1
<script src="{% static 'js/jquery-1.8.3.min.js' %}"></script>

注意：<script> 标签在 <head></head>标签中间

继承

所有页面风格比较一致，例如导航栏、侧面栏等都一致，只有其他部分不一致。可以将导航栏和侧面栏作为模板页，其他页面继承。

模板标签

语法格式

1
{% block %}

使用
  1. 模板页使用 block 标识需要载入子页面的位置
  2. 子页面使用 extends 继承模板页，然后在 block 标识内添加子页面的内容
    实例
    模板页 base.html
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    {% load staticfiles %}
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script src="{% static 'js/jquery-1.8.3.min.js' %}"></script>
    </head>
    <body>
    <h1>我是顶部</h1>

    <div>
        {% block content %}

        {% endblock %}

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

子页面login.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
{% extends "base.html" %}

    {% block content %}
        <h1>{{ a.0 }}</h1>
        {% for item in obj_li %}
            <div>
                {% if item.username == 'test' %}
                    <span>{{ item.username }}</span>
                    <span>{{ item.password }}</span>
                {% endif %}
            </div>
        {% endfor %}
        {{ test }}
        {{ test | cut:' ' }}
    <br>
        {{ d }}
    <br>
        {{ d|date:'Y-m-d' }}

        {% load my_tag %}
        <p>{{ test | filter_func:'666' }}</p>

        {% filter_tag 'a' 'b' 'c' 'd' %}

    {% endblock %}

使用最佳实践
  • 如果在模板中使用 {% extends %} ，必须保证其为模板中的第一个模板标记。 否则，模板继承将不起作用。
  • 一般来说，基础模板中的 {% block %} 标签越多越好。 记住，子模板不必定义父模板中所有的代码块，因此你可以用合理的缺省值对一些代码块进行填充，然后只对子模板所需的代码块进行（重）定义。 俗话说，钩子越多越好。
  • 如果发觉自己在多个模板之间拷贝代码，你应该考虑将该代码段放置到父模板的某个 {% block %} 中。如果你需要访问父模板中的块的内容，使用 {{ block.super }}这个标签吧，这一个魔法变量将会表现出父模板中的内容。如果只想在上级代码块基础上添加内容，而不是全部重载，该变量就显得非常有用了。
  • 不允许在同一个模板中定义多个同名的 {% block %} 。存在这样的限制是因为block 标签的工作方式是双向的。也就是说，block 标签不仅挖了一个要填的坑，也定义了在父模板中这个坑所填充的内容。如果模板中出现了两个相同名称的 {% block %} 标签，父模板将无从得知要使用哪个块的内容。

Recommended Posts