Flask模板
1.1 模板引擎
Flask 使用 Jinja2 作为默认模板引擎
1.2 默认配置
template_folder='templates'——模板的默认目录
render_template() ——(x)html自动转义
render_template_string() ——字符串自动转义
{% autoescape %} ——手动设置是否转义
全局函数和辅助对象——增强模板的功能
1.2 转义
把有特殊意义的字符显示出来html标签中的<>——<>代码中的&——&
特殊字符转义对照表>>https://tool.oschina.net/commons?type=2
1.3 全局对象
config——Flask的配置信息
request——请求对象
session——会话对象
g——请求相关的全局变量(如:g.user)
1.4 全局函数
url_for():URL解析函数(如:静态文件地址解析、链接跳转地址解析)
get_flashed_messages():会话消息
1.5 上下文处理器
在模板的上下文中添加新的内容
内容可以是变量,也可以是函数
@app.context_processor
def inject_user():
return dict(user=g.user)
1.6 模板中变量的使用
渲染机制
模板引擎怎样在浏览器展示HTML
从磁盘读取html字符串
将满足特定规则的内容进行替换
发送给浏览器展示
变量的使用
语法:”{{ object.attribute }}或{{ object['attribute'] }}
dict类型数据的渲染
list/tuple类型数据的渲染
list/tuple嵌套dict复杂类型数据的渲染
1.7 模板语法
模板标签
语法: {% tag %}
{% tag %}内容{% endtag %}
标签中可包含表达式:如:if条件控制
条件表达式 :
{% if condition_a %}
满足了A条件
{% elif condition_b %}
满足了B条件
{% else %}
都不满足
{% endif %}
if标签中的is判断:
{% if value is defined %}
…..
{% endif %}
内置的判断条件:
defined/undefined——变量是否已经定义
none——变量是否为None
number/string——数字/字符串判断
even/odd——奇偶判断
upper/lower——大小写判断
if标签中的其他逻辑控制:
and, or == , !=
> , < >= , <=
in, not in
for循环 :
<ul>
{% for key, value in data. iteritems() %}
<li class="{{ loop.cycle('odd', 'even') }}">
{{ key }}: {{ value }}
</li>
{% else %}
<li>暂无数据</li> {% endfor %}
</ul>
for循环体内的变量:
变量 描述
loop.index 当前循环迭代的次数(从 1 开始)
loop.index0 当前循环迭代的次数(从 0 开始)
loop.revindex 到循环结束需要迭代的次数(从 1 开始)
loop.revindex0 到循环结束需要迭代的次数(从 0 开始)
loop.first 如果是第一次迭代,为 True
loop.last 如果是最后一次迭代,为 True
loop.length 序列的长度
loop.cycle 在一串序列间期取值的辅助函数
如果要在for循环中使用continue/break怎么办?
jinja_env = Environment(extensions=['jinja2.ext.loopcontrols'])
{% for user in users %}
{%- if loop.index is even %}{% continue %}{% endif %} ...
{% endfor %}
添加其它扩展参考>>http://docs.jinkan.org/docs/jinja2/extensions.html
添加注释
不会显示在浏览器的HTML中:{# 注释内容 #}
去除HTML中多余的空白:在块的开始或结束放置一个减号( - ),不能有空格
{% for item in seq -%}
{{ item }}
{%- endfor %}
设置变量,赋值操作
先设置,后使用,可以通过import导入{% set key, value = (1, 2) %}
使用with代码块,实现块级作用域
{% with %}
{% set value = 42 %}
{{ value }} 只在代码块中有效
{% endwith %}
过滤器
什么是过滤器
过滤器:修改变量(如:格式化显示)
用管道符号( | )分割 {{ name|striptags }}
可以链式调用 {{ name|striptags|title }}
可以用圆括号传递可选参数 {{ list|join(', ') }}
过滤器的使用
方式一:用管道符号( | ){{ value|safe }}
方式二:使用标签
{% filter upper %}
This text becomes uppercase
{% endfilter %}
内置的过滤器
求绝对值:{{ value|abs }}
默认值显示 :default(value, default_value=' ', boolean=False)
{{ value|default('默认值') }}
{{ value|d('默认值') }}
html转义: {{ value | escape }} 或 {{ value | e }}
富文本内容转义显示: {{ value|safe }}
倒序显示: {{ value|reverse }}
更多内容>>http://docs.jinkan.org/docs/jinja2/templates.html#builtin-filters
自定义过滤器
方式一:使用装饰器注册
@app.template_filter('reverse')
def reverse_filter(s):
return s[::-1]
方式二:调用函数注册
def reverse_filter(s):
return s[::-1]
app.jinja_env.filters['reverse'] = reverse_filter
转义显示
方式一:视为字符串
{{ '{{ }} {% %}' }}
方式二:使用raw标签
{% raw %}
{% for key, value in data.items %}
{{ key }}: {{ value }}
{% endfor %} {% endraw %}
1.8 模板全局函数
全局函数可在模板中直接使用
示例:
<ul>
{% for i in range(10) %}
<li>{{ i }}</li>
{% endfor %}
</ul>
range([start], stop[, step])
dict(**items)
cycler(*items)——可用于css类名的循环
joiner(sep=‘, ’)——可用于字符串拼接
1.9 模板中的宏
把常用功能抽取出来,实现可重用
简单理解:宏≈函数
ignore miss
宏可以写在单独的html文件中
定义宏——像书写函数一样定义宏
{% macro input(name, value='', type='text', size=20) -%}
<input type="{{ type }}" name="{{ name }}" value="{{value|e }}" size="{{ size }}">
{%- endmacro %}
使用宏——像调用函数一样调用
<p>{{ input('username') }}</p>
<p>{{ input('password', type='password') }}</p>
文件中宏的使用
1. 将前面定义的宏保存为forms.html
2. 导入:
{% import 'forms.html' as forms %} {% from 'forms.html' import input %}
3. 使用:<p>{{ forms.input('username') }}</p>
2.0 模板的继承
继承实现
步骤一:将可变的部分圈出来(base.html)
{% block sidebar %}<!--菜单栏的内容 --> {% endblock %}
步骤二:继承父模板
{% extends "base.html" %}
步骤三:填充新的内容(index.html)
{% extends "base.html" %}
{% block sidebar %}<!-- 新的菜单栏的内容 --> {% endblock %}
步骤四:复用父模板的内容(可选)
{% extends "base.html" %}
{% block sidebar %}
{{ super() }}
<!-- 新的菜单栏的内容 -->
{% endblock %}
包含实现
步骤一:将可变的部分拆出来(footer.html)
<footer>
这是页脚公共的部分
</footer>
步骤二:将拆出来的部分包进来(index.html)
{% extends "base.html" %}
{% block content %}
<!– 页面主要内容区域-->
{# 公用的footer #}
{% include "footer.html" %}
{% endblock %}
include标签
示例
{% include "footer.html" ignore missing %}
ignore missing : 如果模板不存在,jinjia2会忽略这条语句
{% include "footer.html" ignore missing with context %}
ignore missing with context : 不携带当前页面的上下文
{% include "footer.html" ignore missing without context%}
ignore missing without context : 携带当前页面的上下文
代码的复用
当前页面的代码复用:
<title>{% block title %}{% endblock %}</title>
<h1>{{self.title}</h1>
{% block body %}{% endblock %}
2.1 消息闪现
第一步:在视图中产生一个消息(提示/警告/错误)
flash(msg_content, msg_type)
参数msg_content: 消息内容
参数msg_type: 消息类型
第二步:在模板中展示消息
get_flashed_messages(category_filter=["error"])
参数category_filter:对产生的消息按类别查询
<ul class=flashes>
{% for category, message in get_flashed_messages(with_categories=true) %}
<li class="{{ category }}">{{ message }}</li>
{% endfor %}
</ul>