Django 模板技术 | 学习笔记

Django 模板技术

内容简介：

一、 模板

二、 模板配置

三、模板渲染

四、模板页

五、 DTL 语法

 

一、 模板

如果使用 react 实现前端页面，其实 Django 就没有必须使用模板，它其实就是一个后台服务程序，接收请求，响应数据。接口设计就可以是纯粹的Restful风格。

模板的目的就是为了可视化，将数据按照一定布局格式输出，而不是为了数据处理，所以一般不会有复杂的处理逻辑。模板的引入实现了业务逻辑和显示格式的分离，这样，在开发中，就可以分工协作，页面开发完成页面布局设计，后台开发完成数据处理逻辑的实现。

Python 的模板引擎默认使用 Django template language(DTL) 构建。

 

二、模板配置

在 settings.py 中，设置模板项目的路径，其中 DIRS 是写去搜索模板的路径，比如 os.path.join(BASE_DIR, ‘db.sqlite3’)

注：原有配置一般不要删，能注释的注释去保留一份原来的

在[]中填入 os.path.join(BASE_DIR, ‘templates’)

APP_DIRS 是否运行在每个已经安装的应用中查找模板。应用自己目录下有templates 目录，例如 django/contrib/admin/templates。如果应用需要可分离、可重用，建议把模板放到应用目录下

BASE_DIR 是项目根目录， os.path.join(BASE_DlR, 'templates') 就是在manage.py 这一层建立一个目录 templates。这个路径就是以后默认找模板的地方。

三、模板渲染

\1. 加载模板

模板是一个文件，需要从磁盘读取并加载。

\2. 渲染

模板需要内容数据来渲染，生成HTML文件内容

from django.template import loader, RequestContext
def index(request:HttpRequest):
"""视图函数：请求进来返回响应"""
template = loader.get_template( 'index.html ') #加载器模块搜索模板并加载它
context = RequestContext(request, { 'content ': ' www.magedu.com'})
return HttpResponse(template.render(context))

 

render 快捷渲染函数

建立一个 templates 目录

准备将之前 urls.py 中的 index 换成模板

增加 from django.shortcuts import render

django 提供了一个快捷函数 render，render 函数的用法如下：

render(request, template_name, context=None)，返回对象

HttpResponse，

template_name 模板名称，context 数据字典，render_to_string()

输入return render(request, ‘index.html’, { ‘user’ : ‘hello magedu’ })，注释掉return JsonResponse( {‘user’: ‘hello magedu’})一行

可以追到函数里看上下文，有 get template，get template 实际上是解决怎么通过模板名去找到模板，在配置里找

可以看到 get template 在 loader 文件中，loader 是在 Django 模板的 loader 中

所以从 Django的template loader 下导入 get_template，即输入 from django.template. Loader import get_template

 

四、模板页

在 template 下创建一个 HTML File

将 Title 写成主页

在 中写：

欢迎您访问

{ {content} }{ {user} }

将模板 index.html 放到 templates 目录下，使用浏览器访问首页，可以正常显示

user 对应的就是字典中的 key

添加

tpl = loader.get_template( ‘index.html’ )

context = RequestContext(request, { ‘content’ : ‘www.magedu.com’ } )

return HttpResponse(tpl.render(context))

再导包 from django.template import loader, RequestContext

但其实这种方法复杂，不使用，先注释掉

 

五、 DTL 语法

1.变量

语法{ { variable } }

变量名由字母、数字、下划线、点号组成。点号使用的时候，例如foo.bar，遵循以下顺序：

1 字典查找，例如 foo["bar"]，把 foo 当做字典，bar 当做 key

2 属性或方法的查找，例如 foo.bar，把 foo 当做对象，bar 当做属性或方法

3 数字索引查找，例如 oo[bar]，把 foo 当做列表一样，使用索引访问

如果变量未能找到，则缺省插入空字符串"

在模板中调用方法，不能加小括号，自然也不能传递参数。 {{ my_dict.keys } 这样是对的，不能写成 {{ my_dict.keys() }}

⒉模板标签

if/else 标签

基本语法格式如下:

{% if condition %}
... display
{% endif %}

 

或者︰

{% if condition1 %}
... display 1
{% elif condition2 %}
  ... display 2
{% else %}
... display 3
{% endif %}

 

条件也支持 and、or、not

注意，因为这些标签是断开的，所以不能像 Python 一样使用缩进就可以表示出来，必须有个结束标签﹐例如 endif、endfor

for 标签

https://docs.djangoproject.com/en/2.0/ref/templates/builtins/#for

{{ athlete.name }}
{% endfor %}
{% endfor %}

 

变量	说明
forloop.counter	当前循环从1开始的计数
forloop.counter0	当前循环从0开始的计数
forloop.revcounter	从循环的末尾开始倒计数到1
forloop.revcounter0	从循环的末尾开始到计数到0
forloop.first	第一次进入循环
forloop.last	最后一次进入循环
forloop.parentloop	循环嵌套时，内层当前循环的外层循环

 

{% for person in person_list %}
{{ person.name }}  
{% endfor %}

 

变量

说明

forloop.counter

 

当前循环从1开始的计数

forloop.counter0

 

当前循环从0开始的计数

forloop.revcounter

 

从循环的末尾开始倒计数到 1

forloop.revcounter0

 

从循环的末尾开始到计数到 0

forloop.first

 

第一次进入循环

forloop.last

 

最后一次进入循环

forloop.parentloop

 

循环嵌套时，内层当前循环的外层循环

给标签增加一个 reversed 使得该列表被反向迭代：

{% for athlete in athlete_list reversed %}
...
{% empty %}

 

..．

如果被迭代的列表是空的或者不存在，执行 empty

{% endfor %}

 

可以嵌套使用{% for %}标签∶

`{% for athlete in athlete_list %}```

{{ athlete.name }}

`{% for sport in athlete.sports_played %}```

{{ sport }}
{% endfor %}
{ % endfor %}
testfor.html模板
测试for
字典是dict(zip( 'abced' , range(1,6)))

{{forloop.counter}} {{k}} {{v}}
{% endfor %}
{{forloop.counter0}} {{k}} {{v}}
{% endfor %}
{{ forloop.first }}
{{ forloop.last }}
{{forloop.revcounter0}} {{k}} {{v}}
{% endfor %}
{{forloop.revcounter}} {{k}} {{v}}
{% endfor %}
ifequal/ifnotequal标签

 

{% ifequal %} 标签比较两个值，当他们相等时，显示在 {% ifequal %}和{% endifequal %} 之中所有的值。下面的例子比较两个模板变量 user 和 currentuser ：

{% ifequal user currentuser %}
Welcome!
{%endifequal %}

 

和{% if %}类似，{% ifequal %}支持可选的{% else %}标签：

{% ifequal section 'sitenews’ %}
Site News
{% else %}
No News Here
{% endifequal %}

 

其他标签

csrf_token 用于跨站请求伪造保护，防止跨站攻击的。

{% csrf_token %}

3.注释标签

单行注释{# #}。

多行注释{% comment %} ... {% endcomment %}.

{#这是一个注释#}

{% comment %}

这是多行注释

{% endcomment %}.

4.过滤器

模板过滤器可以在变量被显示前修改它。语法{{变量|过滤器}}

过滤器使用管道字符│，例如 ({{name|lower }}， {{ name }} 变量被过滤器 lower 处理后，文档大写转换文本为小写。

过滤管道可以被套接，一个过滤器管道的输出又可以作为下一个管道的输入，例如{{ my_list |first|upper }} ，将列表第一个元素并将其转化为大写。

过滤器传参

有些过滤器可以传递参数，过滤器的参数跟随冒号之后并且总是以双引号包含。

例如 ∶{{ bio |truncatewords:"30"}} ，截取显示变量 bio 的前30个词。

{{ my_list|join: ","}} ，将 my_list 的所有元素使用,逗号连接起来

其他过滤器

器	说明	举例
first	取列表第一个元素
last	取列表最后元素
yesno	变量可以是True、False、None , yesno的参数给定逗号分隔的三个值，返回3个值中的一个。True对应第一个False对应第二个None对应第三个如果参数只有2个，None等效False处理	{{value|yesno:"yeah,no,maybe" }}
add	加法。参数是负数就是减法	数字加{{ value|add:"100"}}列表合并{{mylist |add:newlist}}
divisibleby	能否被整除	{{ value | divisibleby:"3"}}能被3整除返回True
addslashes	在反斜杠、单引号或者双引号前面加上反斜杠	{{value | addslashes }}
length	返回变量的长度	{% if my_list | length > 1 %}
default	变量等价False则使用缺省值	{{ value |default:"nothing" }}
default_if_none	变量为None使用缺省值	{{value|default_if_none:"nothing"}}

过滤器

说明

举例

first

取列表第一个元素

last

取列表最后元素

yesno

变量可以是 True、False、None , yesno 的参数给定逗号分隔的三个值，返回3个值中的一个。

True 对应第一个

False 对应第二个

None 对应第三个

如果参数只有2个，None 等效 False 处理

{{value|yesno:"yeah,no,maybe" }}
add

加法。参数是负数就是减法

数字加 {{ value|add:"100"}}

列表合并 {{mylist |add:newlist}}

divisibleby

能否被整除

{{ value | divisibleby:"3"}} 能被3整除返回 True

addslashes

在反斜杠、单引号或者双引号前面加上反斜杠

{{value | addslashes }}
length

返回变量的长度

{% if my_list | length > 1 %}
default

变量等价 False 则使用缺省值

{{ value |default:"nothing" }}
default_if_none

变量为 None 使用缺省值

{{value|default_if_none:"nothing"}}

date :按指定的格式字符串参数格式化 date 或者 datetime 对象，实例:

{{ pub_date | date:"n j, Y" }}
n 1~12月
j 1~31日
Y 2000年

时间的格式字符查看：

https://docs.djangoproject.com/en/2.0/ref/templates/builtins/#date

练习：要求模板中列表输出多行数据，要求奇偶行颜色不同

主页
欢迎您访问
{ {a} }  { {b} }``{% for k,v in d.items %}
{% if forloop.counter0|divisibleby:"2" %}
{ {forloop.counter0} }  { {k} }  { {v} }
{% else %}
{ {forloop.counter0} }  { {k} }  { {v} }
{% endif %}
{ % endfor % }
其他方法
{% for k,v in d.items %}
{ {forloop.counter0} }  { {k} }  { {v} }
{% endif %}
{ % endfor % }
style只能固定颜色，所以一般不用style，用class动态调用，外部加载一个样式，所以再改成
加上定义 
.odd {
backgroundcolor:red
}
.even {
}