# 模版简介
模板是一个`web`开发必备的模块。因为我们在渲染一个网页的时候，并不是只渲染一个纯文本字符串，而是需要渲染一个有富文本标签的页面。这时候我们就需要使用模板了。在`Flask`中，配套的模板是`Jinja2`，`Jinja2`的作者也是`Flask`的作者。这个模板非常的强大，并且执行效率高。以下对`Jinja2`做一个简单介绍！
## 渲染`Jinja`模板
要渲染一个模板，通过`render_template`方法即可，以下将用一个简单的例子进行讲解：
创建about.html
```jinja2
welcome back!
```
执行下面代码
```python
from flask import Flask,render_template
app = Flask(__name__)
@app.route('/about/')
def about():
return render_template('about.html')
# 渲染 about.html 注意：必须要在 templates 文件夹下
if __name__ == '__main__':
app.run(debug=True,host='0.0.0.0',port=5000)
```
当访问`/about/`的时候，`about()`函数会在当前目录下的`templates`文件夹下寻找`about.html`模板文件。如果想更改模板文件地址，应该在创建`app`的时候，给`Flask`传递一个关键字参数`template_folder`，指定具体的路径，再看以下例子：
```python
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`文件夹中寻找模板文件。还有最后一点是，如果模板文件中有参数需要传递，应该怎么传呢，我们再来看一个例子：
about.html 修改为如下
```html
welcome {{ user }}
```
在渲染模版的时候传递一下参数
```python
@app.route('/about/')
def about():
return render_template('about.html', user='user01')
```
如果有多个参数要传递的话可以放在字典中
```python
@app.route('/about/')
def about():
return render_template('about.html', **{'user':'alice','name':'bob'})
# about.html 中需要有 user 和 name
```
以上例子介绍了两种传递参数的方式，因为`render_template`需要传递的是一个关键字参数，所以第一种方式是顺其自然的。但是当你的模板中要传递的参数过多的时候，把所有参数放在一个函数中显然不是一个好的选择，因此我们使用字典进行包装，并且加两个`*`号，来转换成关键字参数。
# Jinja2模版概述
## 概要
先看一个简单例子：
```html
My Webpage
{{ a_variable }}
{{ user.name }}
{{ user['name'] }}
{# a comment #}
```
以上示例有需要进行解释：
- 第12~14行的`{{ ... }}`：用来装载一个变量，模板渲染的时候，会把这个变量代表的值替换掉。并且可以间接访问一个变量的属性或者一个字典的`key`。关于点`.`号访问和`[]`中括号访问，没有任何区别，都可以访问属性和字典的值。
- 第7~9行的`{% ... %}`：用来装载一个控制语句，以上装载的是`for`循环，以后只要是要用到控制语句的，就用`{% ... %}`。
- 第16行的`{# ... #}`：用来装载一个注释，模板渲染的时候会忽视这中间的值。
对应的 Python 代码如下
```python
@app.route('/demo1/')
def demo1():
navigation = [
{'href':'http://www.baidu.com','caption':'百度'},
{'href':'http://www.qq.com','caption':'腾讯'}
]
a = 'hello world'
user = {'name':'alice'}
return render_template('demo1.html', navigation=navigation, a_variable=a, user=user)
```
# Jinja2 模版过滤器
过滤器是通过管道符号（`|`）进行使用的，例如：`{{ name|length }}`，将返回name的长度。过滤器相当于是一个函数，把当前的变量传入到过滤器中，然后过滤器根据自己的功能，再返回相应的值，之后再将结果渲染到页面中。`Jinja2`中内置了许多过滤器，在[这里](https://jinja.palletsprojects.com/en/3.0.x/templates/#list-of-builtin-filters)可以看到所有的过滤器，现对一些常用的过滤器进行讲解：
1. `abs(value)`：返回一个数值的绝对值。 例如：`-1|abs`。
2. `default(value,default_value,boolean=false)`：如果当前变量没有值，则会使用参数中的值来代替。`name|default('alice')`——如果name不存在，则会使用`alice`来替代。`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)`：格式化字符串。例如以下代码：
```html
{{ "%s - %s"|format("hello","alice") }}
```
将输出：Hello - alice
6. `last(value)`：返回一个序列的最后一个元素。示例：`names|last`。
7. `length(value)`：返回一个序列或者字典的长度。示例：`names|length`。
8. `join(value,d=u'')`：将一个序列用`d`这个参数的值拼接成字符串。
9. `safe(value)`：如果开启了全局转义，那么`safe`过滤器会将变量关掉转义。示例：`content_html|safe`。
10. `int(value)`：将值转换为`int`类型。
11. `float(value)`：将值转换为`float`类型。
12. `lower(value)`：将字符串转换为小写。
13. `upper(value)`：将字符串转换为大写。
14. `replace(value,old,new)`： 替换将`old`替换为`new`的字符串。
15. `truncate(value,length=255,killwords=False)`：截取`length`长度的字符串。
16. `striptags(value)`：删除字符串中所有的HTML标签，如果出现多个空格，将替换成一个空格。
17. `trim`：截取字符串前面和后面的空白字符。
18. `string(value)`：将变量转换成字符串。
19. `wordcount(s)`：计算一个长字符串中单词的个数。
# 控制语句
所有的控制语句都是放在`{% ... %}`中，并且有一个语句`{% endxxx %}`来进行结束，`Jinja`中常用的控制语句有`if/for..in..`，现对他们进行讲解：
1. `if`：if语句和`python`中的类似，可以使用`>，<，<=，>=，==，!=`来进行判断，也可以通过`and，or，not，()`来进行逻辑合并操作，以下看例子：
```jinja2
{% if num < 60 %}
你猜的数字小了
{% elif num > 60 %}
你猜的数字大了
{% else %}
你猜对了
{% endif %}
```
2. `for...in...`：`for`循环可以遍历任何一个序列包括列表、字典、元组。并且可以进行反向遍历，以下将用几个例子进行解释：
- 普通的遍历：
```jinja2
{% for user in users %}
- {{ user.username|e }}
{% endfor %}
```
- 遍历字典：
```jinja2
{% for key, value in my_dict.items() %}
- {{ key|e }}
- {{ value|e }}
{% endfor %}
```
- 如果序列中没有值的时候，进入`else`：
```jinja2
{% for user in users %}
- {{ user.username|e }}
{% else %}
- no users found
{% endfor %}
```
并且`Jinja2`中的`for`循环还包含以下变量，可以用来获取当前的遍历状态：
| 变量 | 描述 |
| :---------- | :---------------------------------- |
| loop.index | 当前迭代的索引（从1开始） |
| loop.index0 | 当前迭代的索引（从0开始） |
| loop.first | 是否是第一次迭代，返回True或False |
| loop.last | 是否是最后一次迭代，返回True或False |
| loop.length | 序列的长度 |
另外，**不可以**使用`continue`和`break`表达式来控制循环的执行。
# 测试器
测试器主要用来判断一个值是否满足某种类型，并且这种类型一般通过普通的`if`判断是有很大的挑战的。语法是：`if...is...`，先来简单的看个例子：
```jinja2
{% if variable is upper %}
value of variable: {{ variable }}
{% else %}
variable is not upper
{% endif %}
```
以上判断`variable`这个变量是否全大写，`Jinja`中内置了许多的测试器，看以下列表：
| 测试器 | 说明 |
| :----------------- | :----------------- |
| `callable(object)` | 是否可调用 |
| `defined(object)` | 是否已经被定义了。 |
| `escaped(object)` | 是否已经被转义了。 |
| `upper(object)` | 是否全是大写。 |
| `lower(object)` | 是否全是小写。 |
| `string(object)` | 是否是一个字符串。 |
| `sequence(object)` | 是否是一个序列。 |
| `number(object)` | 是否是一个数字。 |
| `odd(object)` | 是否是奇数。 |
| `even(object)` | 是否是偶数。 |
## 赋值（set）语句
有时候我们想在在模板中添加变量，这时候赋值语句（set）就派上用场了，先看以下例子：
```jinja2
{% set name='eagle' %}
```
那么以后就可以使用`name`来代替`eagle`这个值了，同时，也可以给他赋值为列表和元组：
```jinja2
{% set navigation = [('index.html', 'Index'), ('about.html', 'About')] %}
```
赋值语句创建的变量在其之后都是有效的，如果不想让一个变量污染全局环境，可以使用`with`语句来创建一个内部的作用域，将`set`语句放在其中，这样创建的变量只在`with`代码块中才有效，看以下示例：
```jinja2
{% with %}
{% set foo = 42 %}
{{ foo }} foo is 42 here
{% endwith %}
```
也可以在`with`的后面直接添加变量，比如以上的写法可以修改成这样：
```jinja2
{% with foo = 42 %}
{{ foo }}
{% endwith %}
```
这两种方式都是等价的，一旦超出`with`代码块，就不能再使用`foo`这个变量了。
```html
Document
{% set name="alice" %}
欢迎{{ name }}
{% set link=[('http://www.baidu.com','百度'),('http://www.qq.com','腾讯')] %}
{% set foo=24 %}
{% with foo=88 %}
在局部作用域中的值：{{ foo }}
{% endwith %}
在全局作用域中的值：{{ foo }}
{# with中的修改不会影响全局的内容 #}
```
# 静态文件的配置
`Web`应用中会出现大量的静态文件来使得网页更加生动美观。类似于`CSS`样式文件、`JavaScript`脚本文件、图片文件、字体文件等静态资源。在`Jinja`中加载静态文件非常简单，只需要通过`url_for`全局函数就可以实现，看以下代码：
```html
```
`url_for`函数默认会在项目根目录下的`static`文件夹中寻找`about.css`文件，如果找到了，会生成一个相对于项目根目录下的`/static/about.css`路径。当然我们也可以把静态文件不放在`static`文件夹中，此时就需要具体指定了，看以下代码：
```python
app = Flask(__name__,static_folder='C:\static')
```
那么访问静态文件的时候，将会到`/static`这个文件夹下寻找。