1. 模板简介

模板是一个web开发必备的模块。因为我们在渲染一个网页的时候，并不是只渲染一个纯文本字符串，而是需要渲染一个有富文本标签的页面。这时候我们就需要使用模板了。在Flask中，配套的模板是Jinja2，Jinja2的作者也是Flask的作者。这个模板非常的强大，并且执行效率高。以下对Jinja2做一个简单介绍！

1.1 Flask渲染Jinja模板：

要渲染一个模板，通过render_template方法即可，以下将用一个简单的例子进行讲解：

from flask import Flask,render_template
app = Flask(__name__)@app.route('/about/')
def about():return render_template('about.html')

当访问/about/的时候，about()函数会在当前目录下的templates文件夹下寻找about.html模板文件。如果想更改模板文件地址，应该在创建app的时候，给Flask传递一个关键字参数template_folder，指定具体的路径，再看以下例子：

from flask import Flask,render_template
app = Flask(__name__,template_folder=r'C:\templates')@app.route('/about/')
def about():return render_template('about.html')

以上例子将会在C盘的templates文件夹中寻找模板文件。还有最后一点是，如果模板文件中有参数需要传递，应该怎么传呢，我们再来看一个例子：

from flask import Flask,render_template
app = Flask(__name__)@app.route('/about/')
def about():# return render_template('about.html',user='eagle')return render_template('about.html',**{'user':'eagle'})

以上例子介绍了两种传递参数的方式，因为render_template需要传递的是一个关键字参数，所以第一种方式是顺其自然的。但是当你的模板中要传递的参数过多的时候，把所有参数放在一个函数中显然不是一个好的选择，因此我们使用字典进行包装，并且加两个*号，来转换成关键字参数。

2. Jinja2模版概述

2.1 概要：

先看一个简单例子：

1. <html lang="en">
2. <head>
3.    <title>My Webpage</title>
4. </head>
5. <body>
6.     <ul id="navigation">
7.     {% for item in navigation %}
8.         <li><a href="{{ item.href }}">{{ item.caption }}</a></li>
9.     {% endfor %}
10.    </ul>
11.
12.    {{ a_variable }}
13.    {{ user.name }}
14.    {{ user['name'] }}
15.
16.    {# a comment #}
17. </body>
18.</html>

以上示例有需要进行解释：

  • 第12~14行的{{ ... }}：用来装载一个变量，模板渲染的时候，会把这个变量代表的值替换掉。并且可以间接访问一个变量的属性或者一个字典的key。关于点.号访问和[]中括号访问，没有任何区别，都可以访问属性和字典的值。
  • 第7~9行的{% ... %}：用来装载一个控制语句，以上装载的是for循环，以后只要是要用到控制语句的，就用{% ... %}。
  • 第14行的{# ... #}：用来装载一个注释，模板渲染的时候会忽视这中间的值。

2.2 属性访问规则：

  1. 比如在模板中有一个变量这样使用：foo.bar，那么在Jinja2中是这样进行访问的：

    • 先去查找foo的bar这个属性，也即通过getattr(foo,'bar')。
    • 如果没有，就去通过foo.__getitem__('bar')的方式进行查找。
    • 如果以上两种方式都没有找到，返回一个undefined。
  2. 在模板中有一个变量这样使用：foo['bar']，那么在Jinja2中是这样进行访问：
    • 通过foo.__getitem__('bar')的方式进行查找。
    • 如果没有，就通过getattr(foo,'bar')的方式进行查找。
    • 如果以上没有找到，则返回一个undefined。

3. Jinja2模版过滤器

过滤器是通过管道符号（|）进行使用的，例如：{{ name|length }}，将返回name的长度。过滤器相当于是一个函数，把当前的变量传入到过滤器中，然后过滤器根据自己的功能，再返回相应的值，之后再将结果渲染到页面中。Jinja2中内置了许多过滤器，在这里可以看到所有的过滤器，现对一些常用的过滤器进行讲解：

  1. abs(value)：返回一个数值的绝对值。 例如：-1|abs。

  2. default(value,default_value,boolean=false)：如果当前变量没有值，则会使用参数中的值来代替。name|default('xiaotuo')——如果name不存在，则会使用xiaotuo来替代。boolean=False默认是在只有这个变量为undefined的时候才会使用default中的值，如果想使用python的形式判断是否为false，则可以传递boolean=true。也可以使用or来替换。

  3. escape(value)或e：转义字符，会将<、>等符号转义成HTML中的符号。例如：content|escape或content|e。

  4. first(value)：返回一个序列的第一个元素。names|first。

  5. format(value,*arags,**kwargs)：格式化字符串。例如以下代码：

{{ "%s" - "%s"|format('Hello?',"Foo!") }}

将输出：Helloo? - Foo!

  1. last(value)：返回一个序列的最后一个元素。示例：names|last。

  2. length(value)：返回一个序列或者字典的长度。示例：names|length。

  3. join(value,d=u'')：将一个序列用d这个参数的值拼接成字符串。

  4. safe(value)：如果开启了全局转义，那么safe过滤器会将变量关掉转义。示例：content_html|safe。

  5. int(value)：将值转换为int类型。

  6. float(value)：将值转换为float类型。

  7. lower(value)：将字符串转换为小写。

  8. upper(value)：将字符串转换为小写。

  9. replace(value,old,new)： 替换将old替换为new的字符串。

  10. truncate(value,length=255,killwords=False)：截取length长度的字符串。

  11. striptags(value)：删除字符串中所有的HTML标签，如果出现多个空格，将替换成一个空格。

  12. trim：截取字符串前面和后面的空白字符。

  13. string(value)：将变量转换成字符串。

  14. wordcount(s)：计算一个长字符串中单词的个数。

4. 控制语句

所有的控制语句都是放在{% ... %}中，并且有一个语句{% endxxx %}来进行结束，Jinja中常用的控制语句有if/for..in..，现对他们进行讲解：

  1. if：if语句和python中的类似，可以使用>，<，<=，>=，==，!=来进行判断，也可以通过and，or，not，()来进行逻辑合并操作，以下看例子：
{% if kenny.sick %}Kenny is sick.
{% elif kenny.dead %}You killed Kenny!  You bastard!!!
{% else %}Kenny looks okay --- so far
{% endif %}

  1. for...in...：for循环可以遍历任何一个序列包括列表、字典、元组。并且可以进行反向遍历，以下将用几个例子进行解释：

    • 普通的遍历：
<ul>
{% for user in users %}
<li>{{ user.username|e }}</li>
{% endfor %}
</ul>
  • 遍历字典：
<dl>
{% for key, value in my_dict.iteritems() %}<dt>{{ key|e }}</dt><dd>{{ value|e }}</dd>
{% endfor %}
</dl>
  • 如果序列中没有值的时候，进入else：
<ul>
{% for user in users %}<li>{{ user.username|e }}</li>
{% else %}<li><em>no users found</em></li>
{% endfor %}
</ul>

并且Jinja中的for循环还包含以下变量，可以用来获取当前的遍历状态：

变量 描述
loop.index 当前迭代的索引（从1开始）
loop.index0 当前迭代的索引（从0开始）
loop.first 是否是第一次迭代，返回True或False
loop.last 是否是最后一次迭代，返回True或False
loop.length 序列的长度

另外，不可以使用continue和break表达式来控制循环的执行。

5. 测试器

测试器主要用来判断一个值是否满足某种类型，并且这种类型一般通过普通的if判断是有很大的挑战的。语法是：if...is...，先来简单的看个例子：

{% if variable is escaped%}value of variable: {{ escaped }}
{% else %}variable is not escaped
{% endif %}

以上判断variable这个变量是否已经被转义了，Jinja中内置了许多的测试器，看以下列表：

测试器 说明
callable(object) 是否可调用
defined(object) 是否已经被定义了。
escaped(object) 是否已经被转义了。
upper(object) 是否全是大写。
lower(object) 是否全是小写。
string(object) 是否是一个字符串。
sequence(object) 是否是一个序列。
number(object) 是否是一个数字。
odd(object) 是否是奇数。
even(object) 是否是偶数。

6. 宏和import语句

6.1 宏：

模板中的宏跟python中的函数类似，可以传递参数，但是不能有返回值，可以将一些经常用到的代码片段放到宏中，然后把一些不固定的值抽取出来当成一个变量，以下将用一个例子来进行解释：

{% macro input(name, value='', type='text') %}<input type="{{ type }}" name="{{ name }}" value="{{ value|e }}">
{% endmacro %}

以上例子可以抽取出了一个input标签，指定了一些默认参数。那么我们以后创建input标签的时候，可以通过他快速的创建：

<p>{{ input('username') }}</p>
<p>{{ input('password', type='password') }}</p>

6.2 import语句：

在真实的开发中，会将一些常用的宏单独放在一个文件中，在需要使用的时候，再从这个文件中进行导入。import语句的用法跟python中的import类似，可以直接import...as...，也可以from...import...或者from...import...as...，假设现在有一个文件，叫做forms.html，里面有两个宏分别为input和textarea，如下：

{% macro input(name, value='', type='text') %}<input type="{{ type }}" value="{{ value|e }}" name="{{ name }}">
{% endmacro %}{% macro textarea(name, value='', rows=10, cols=40) %}<textarea name="{{ name }}" rows="{{ rows }}" cols="{{ cols}}">{{ value|e }}</textarea>
{% endmacro %}

6.3 导入宏的例子：

  1. import...as...形式：
{% import 'forms.html' as forms %}
<dl><dt>Username</dt><dd>{{ forms.input('username') }}</dd><dt>Password</dt><dd>{{ forms.input('password', type='password') }}</dd>
</dl>
<p>{{ forms.textarea('comment') }}</p>
  1. from...import...as.../from...import...形式：
{% from 'forms.html' import input as input_field, textarea %}
<dl><dt>Username</dt><dd>{{ input_field('username') }}</dd><dt>Password</dt><dd>{{ input_field('password', type='password') }}</dd>
</dl>
<p>{{ textarea('comment') }}</p>

另外需要注意的是，导入模板并不会把当前上下文中的变量添加到被导入的模板中，如果你想要导入一个需要访问当前上下文变量的宏，有两种可能的方法:

  • 显式地传入请求或请求对象的属性作为宏的参数。

  • 与上下文一起（with context）导入宏。

    与上下文中一起（with context）导入的方式如下:

 {% from '_helpers.html' import my_macro with context %}

7. include和set语句

7.1 include语句：

include语句可以把一个模板引入到另外一个模板中，类似于把一个模板的代码copy到另外一个模板的指定位置，看以下例子：

{% include 'header.html' %}主体内容
{% include 'footer.html' %}

7.2 赋值（set）语句：

有时候我们想在在模板中添加变量，这时候赋值语句（set）就派上用场了，先看以下例子：

{% set name='eagle' %}

那么以后就可以使用name来代替eagle这个值了，同时，也可以给他赋值为列表和元组：

{% set navigation = [('index.html', 'Index'), ('about.html', 'About')] %}

赋值语句创建的变量在其之后都是有效的，如果不想让一个变量污染全局环境，可以使用with语句来创建一个内部的作用域，将set语句放在其中，这样创建的变量只在with代码块中才有效，看以下示例：

{% with %}{% set foo = 42 %}{{ foo }}           foo is 42 here
{% endwith %}

也可以在with的后面直接添加变量，比如以上的写法可以修改成这样：

{% with foo = 42 %}{{ foo }}
{% endwith %}

这两种方式都是等价的，一旦超出with代码块，就不能再使用foo这个变量了。

8. 模版继承

Flask中的模板可以继承，通过继承可以把模板中许多重复出现的元素抽取出来，放在父模板中，并且父模板通过定义block给子模板开一个口，子模板根据需要，再实现这个block，假设现在有一个base.html这个父模板，代码如下：

<!DOCTYPE html>
<html lang="en">
<head><link rel="stylesheet" href="base.css" /><title>{% block title %}{% endblock %}</title>{% block head %}{% endblock %}
</head>
<body><div id="body">{% block body %}{% endblock %}</div><div id="footer">{% block footer %}&copy; Copyright 2008 by <a href="http://domain.invalid/">you</a>{% endblock %}</div>
</body>
</html>

以上父模板中，抽取了所有模板都需要用到的元素html、body等，并且对于一些所有模板都要用到的样式文件style.css也进行了抽取，同时对于一些子模板需要重写的地方，比如title、head、body都定义成了block，然后子模板可以根据自己的需要，再具体的实现。以下再来看子模板的代码：

{% extends "base.html" %}
{% block title %}首页{% endblock %}
{% block head %}{{ super() }}<style type="text/css">.detail{color: red;}</style>
{% endblock %}
{% block content %}<h1>这里是首页</h1><p class="detail">首页的内容</p>
{% endblock %}

首先第一行就定义了子模板继承的父模板，并且可以看到子模板实现了title这个block，并填充了自己的内容，再看head这个block，里面调用了super()这个函数，这个函数的目的是执行父模板中的代码，把父模板中的内容添加到子模板中，如果没有这一句，则父模板中处在head这个block中的代码将会被子模板中的代码给覆盖掉。

另外，模板中不能出现重名的block，如果一个地方需要用到另外一个block中的内容，可以使用self.blockname的方式进行引用，比如以下示例：

<title>{% block title %}这是标题{% endblock %}
</title>
<h1>{{ self.title() }}</h1>

以上示例中h1标签重用了title这个block中的内容，子模板实现了title这个block，h1标签也能拥有这个值。

另外，在子模板中，所有的文本标签和代码都要添加到从父模板中继承的block中。否则，这些文本和标签将不会被渲染。

9. 转义

转义的概念是，在模板渲染字符串的时候，字符串有可能包括一些非常危险的字符比如<、>等，这些字符会破坏掉原来HTML标签的结构，更严重的可能会发生XSS跨域脚本攻击，因此如果碰到<、>这些字符的时候，应该转义成HTML能正确表示这些字符的写法，比如>在HTML中应该用<来表示等。

但是Flask中默认没有开启全局自动转义，针对那些以.html、.htm、.xml和.xhtml结尾的文件，如果采用render_template函数进行渲染的，则会开启自动转义。并且当用render_template_string函数的时候，会将所有的字符串进行转义后再渲染。而对于Jinja2默认没有开启全局自动转义，作者有自己的原因：

  1. 渲染到模板中的字符串并不是所有都是危险的，大部分还是没有问题的，如果开启自动转义，那么将会带来大量的不必要的开销。
  2. Jinja2很难获取当前的字符串是否已经被转义过了，因此如果开启自动转义，将对一些已经被转义过的字符串发生二次转义，在渲染后会破坏原来的字符串。

在没有开启自动转义的模式下（比如以.conf结尾的文件），对于一些不信任的字符串，可以通过{{ content_html|e }}或者是{{ content_html|escape }}的方式进行转义。在开启了自动转义的模式下，如果想关闭自动转义，可以通过{{ content_html|safe }}的方式关闭自动转义。而{%autoescape true/false%}...{%endautoescape%}可以将一段代码块放在中间，来关闭或开启自动转义，例如以下代码关闭了自动转义：

{% autoescape false %}<p>autoescaping is disabled here<p>{{ will_not_be_escaped }}
{% endautoescape %}

10. 数据类型和运算符

10.1 数据类型：

Jinja支持许多数据类型，包括：字符串、整型、浮点型、列表、元组、字典、True/False。

10.2 运算符：

  • +号运算符：可以完成数字相加，字符串相加，列表相加。但是并不推荐使用+运算符来操作字符串，字符串相加应该使用~运算符。
  • -号运算符：只能针对两个数字相减。
  • /号运算符：对两个数进行相除。
  • %号运算符：取余运算。
  • *号运算符：乘号运算符，并且可以对字符进行相乘。
  • **号运算符：次幂运算符，比如2**3=8。
  • in操作符：跟python中的in一样使用，比如{{1 in [1,2,3]}}返回true。
  • ~号运算符：拼接多个字符串，比如{{"Hello" ~ "World"}}将返回HelloWorld。

11. 静态文件的配置

Web应用中会出现大量的静态文件来使得网页更加生动美观。类似于CSS样式文件、JavaScript脚本文件、图片文件、字体文件等静态资源。在Jinja中加载静态文件非常简单，只需要通过url_for全局函数就可以实现，看以下代码：

<link href="{{ url_for('static',filename='about.css') }}">

url_for函数默认会在项目根目录下的static文件夹中寻找about.css文件，如果找到了，会生成一个相对于项目根目录下的/static/about.css路径。当然我们也可以把静态文件不放在static文件夹中，此时就需要具体指定了，看以下代码：

app = Flask(__name__,static_folder='C:\static')

那么访问静态文件的时候，将会到/static这个文件夹下寻找。

Flask渲染Jinja2模板相关推荐

  1. Flask mysql 模版传参_Flask渲染Jinja2模板和传参

    ### Flask渲染Jinja2模板和传参: 1. 如何渲染模板: * 模板放在`templates`文件夹下 * 从`flask`中导入`render_template`函数. * 在视图函数中, ...

  2. Flask_day_2渲染Jinja2模板和传参（if判断、for循环、过滤器、继承和block、URL链接）

    ***Flask渲染Jinja2模板和传参: 1.如何渲染模板 *模板放在'templates'文件夹下 *在'flask'中导入'render_template' *在视频函数中,用'render_ ...

  3. 【Flask】Jinja2模板的使用及控制语句

    Jinja2模板 在前面的实例中,视图函数的主要作用是生成请求的响应,这是最简单请求.实际上,视图函数有两个作用: 处理业务逻辑 返回响应内容 在大型应用中,把业务逻辑和表现内容放在一起,会增加代码的 ...

  4. 【Flask】Jinja2模板之过滤器

    一.过滤器定义 实质上就是一个转换函数.变量可以通过"过滤器"进行修改,过滤器可以理解为是jinja2里面的内置函数和字符串处理函数. 常用的过滤器有: 1.字符串过滤器 视图函数 ...

  5. Python Flask，Jinja2模板，模板中使用特殊变量及函数，闪现信息，get_flashed_messages()

    在渲染模板时,不需要手动分配,可以直接在模板中使用的模板变量及函数:config.request.url_for().get_flashed_messages() 在Flask中,有一些特殊的变量和方 ...

  6. Flask中Jinja2模板|如何在Jinja2中格式化一个日期

    使用Jinja2,我如何格式化一个日期字段?我知道在Python中我可以简单地做到这一点. print(car.date_of_manufacture.strftime('%Y-%m-%d')) 有两 ...

  7. flask 渲染jinja2模版和传参

    渲染模版(html文件) A.模版文件(html)放入到template目录下,项目启动的时候会从template目录里查找, B.从flask中导入"render_tempalte&quo ...

  8. Flask之jinja2模板（二）

    目录 模板结构 流程控制-选择结构 控制流程-循环结构 for循环练习之99乘法表 宏 宏的使用 模板中宏的使用 模板结构 流程控制-选择结构 所有的控制语句都是放在{% ... %}中,并且有一个语 ...

  9. Flask之jinja2模板（三）

    目录 include导入模板 set与with的使用 set的使用 with语句 静态资源的引入 静态文件 模板继承 模板继承语法 block语法 调用另外一个block中的代码 模板继承练习 inc ...

  10. 第十阶段 -- Flask框架03：【Jinja2模板01：模板；过滤器；控制语句if for】

    文章目录 1. Jinja2模板介绍和查找路径 2. 模板传参及其技巧 3. 模板中使用url_for 4. Jinja2过滤器 1. 基本使用 2. 过滤器介绍 3. default详解 4. 常用 ...

最新文章

  1. 手把手教你在应用里用上iOS机器学习框架Core ML
  2. 全部都是div，换点新花样。【HTML5的标签】
  3. 【渝粤教育】广东开放大学 企业会计准则应用实务形成性考核 (41)
  4. Ubuntu 12.04 LTS安装VMware Tools：无法找到kernel header path的问题
  5. 北上广深的程序员，房子在向你们招手了！
  6. 从保证业务不中断，看网关的“前世今生”
  7. 转textView return 键盘 textfield 键盘
  8. 为什么android手机内存不够,安卓手机老是内存不足怎么解决
  9. pulsar 著名的开源消息传递系统
  10. Oracle中OEM的启动与关闭
  11. 计算机多媒体简历,[计算机个人简历模板范文]计算机多媒体专业个人简历
  12. 我的世界JAVA网易版mod_我的世界中国版严重问题 网易禁止加入mod遭forge谴责
  13. 互联网电商大数据架构图
  14. python桌面爬虫_Python爬虫 利用python爬取ZOL桌面壁纸大图
  15. 如何做到异构数据的同步一致性
  16. npm install 报错 Failed at the XXX install script
  17. 设计模式之适配器模式--简单实例分析
  18. AFN的简单介绍及使用
  19. 国家自然基金的latex模版
  20. 【百度快照】基于MATLAB GUI的条形码识别系统

热门文章

  1. 获取微信公众号地址的图片不能正常显示的问题
  2. UWP 中的各种文件路径（用户、缓存、漫游、安装……）
  3. php是单进程语言，但是也有办法支持多进程
  4. Word2Vec模型配置参数
  5. Excel如何实现随机分组
  6. 【C++】在线IDE
  7. 程序员英文简历范例（通用，含初级、中级和高级）
  8. PS剪切蒙版怎么用？
  9. python绘制图像频谱_python傅里叶变换FFT绘制频谱图
  10. 调用有道智云api做翻译器遇到播放音频的问题