我爱Flask之Flask模板过滤器(你想要的这都有!!)

黄色标注部分重点注意

一. Flask模板过滤器

1. Jinja2模板内置过滤器

       •模板过滤器相当于是一个函数,把当前的变量传入过滤器,过滤器根据自己的功能对变量进行相应的处理,再返回对应的值,并将结果渲染到网页中
       •过滤器是通过管道符号| 来实现的
       •例如:传入变量name,{{ name|length }}将返回变量name的长度
       •当你修改完模板文件后想要文件自动更新并加载,需要配置参数app.config[‘TEMPLATE_AUTO_RELOAD’] = True即可实现
Jinja2中有许多内置过滤器,以后进行一一介绍:

abs(value)

       作用:返回传入变量的绝对值(int类型)
运行测试:

from flask import Flask, render_template

app = Flask(__name__)
app.config['TEMPLATE_AUTO_RELOAD'] = True # 模板修改后自动更新并加载


@app.route('/')
def index():
    context = {
        'name': 'ycx',
        'age': -16
    }

    return render_template('index.html', **context)


if __name__ == '__main__':
    app.run(debug=True)

模板index.html文件:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
</body>
</html>

网页显示:
在这里插入图片描述
将变量的值转换成绝对值显示在网页中

default(value, default_value, boolean=false)

       作用:如果当前变量没有传入值,则会使用参数中的变量值来代替
       例如:name|default(‘jack’)中,如果name变量未在视图函数中定义,则会使用jack来代替
       参数boolean=false默认是在只有这个变量么有定义时的时候才会使用default中的默认值,如果想使用python的形式判断是否为false,则可以传递boolean=true,或者使用or来替换
运行测试:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username|default('这个人很懒,什么都没有留下...') }}</h2>
</body>
</html>

网页显示:
在这里插入图片描述
在视图函数中未定义和传入username参数,渲染给定的默认值,如果在视图函数中定义username参数,则会渲染给定的参数对应的值
       •可以在default()中传入参数boolean=true,此时会根据Python的规则来判断name的布尔值是True还是False,如果判断结果为True则渲染name的值,如果是False则渲染default()中给定的默认值
运行测试:

from flask import Flask, render_template

app = Flask(__name__)
app.config['TEMPLATE_AUTO_RELOAD'] = True


@app.route('/')
def index():
    context = {
        'name': 'ycx',
        'age': -16,
        'username1': None,
        'username2': 'Tony'
    }

    return render_template('index.html', **context)


if __name__ == '__main__':
    app.run(debug=True)

index.html模板代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username1|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
    <h2>{{ username2|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
</body>
</html>

网页显示:
在这里插入图片描述
default()中加入参数boolean=true,username1为None,其布尔值为False,所以会渲染default()中给定的值,username2为一个非空字符串,对应的布尔值为True,则会渲染username2对应的值

escape(value)

       作用:转义字符,会将<、>等特殊符号转义成HTML中的符号,使其成为普通字符串,避免渲染成HTML元素。
       表示方式content|escapecontent|e
运行测试:

from flask import Flask, render_template

app = Flask(__name__)
app.config['TEMPLATE_AUTO_RELOAD'] = True


@app.route('/')
def index():
    context = {
        'name': 'ycx',
        'age': -16,
        'username': 'Tony',
        'script': ' < script > alert("hello") < / script > '

    }

    return render_template('index.html', **context)


if __name__ == '__main__':
    app.run(debug=True)

模板index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
    <h2>{{ script|escape}}</h2>

</body>
</html>

网页显示:
在这里插入图片描述
Flask模板并未将script变量对应的值渲染为Javascript代码,而是当成普通的字符串来渲染
       网页源代码如下:
在这里插入图片描述
Jinja2在渲染时将特殊字符自动转义,在flask中,默认是开启了自动转义的功能的,所以不使用escape过滤器也是可以的
这是Jinja2的一种安全机制,可以防止对页面进行篡改、注入等操作

safe(value)

       作用:如果开启了全局转义,那么safe过滤器会将变量的转义关闭
       表示方式content_html|safe
在上个例子中,如果想要取消转义,可以关闭escape过滤器,测试如下:
模板index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
    {% autoescape off %}
    <h2>{{script}}</h2>
    {% endautoescape %}
</body>
</html>

网页显示:
在这里插入图片描述
使用safe过滤器也可以达到相同的效果,如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
    <h2>{{ script|safe }}</h2>
</body>
</html>

网页显示与之前完全相同
       •可以使用safe过滤器渲染HTML代码
测试如下:

from flask import Flask, render_template

app = Flask(__name__)
app.config['TEMPLATE_AUTO_RELOAD'] = True


@app.route('/')
def index():
    context = {
        'name': 'ycx',
        'age': -16,
        'username': 'Tony',
        'code': '<h3>但行好事,莫问前程</h3>'

    }

    return render_template('index.html', **context)


if __name__ == '__main__':
    app.run(debug=True)

模板index.html:

<!DOCTYPE html>![在这里插入图片描述](https://img-blog.csdnimg.cn/20201021105719259.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MjYxOTYz,size_16,color_FFFFFF,t_70#pic_center)

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
    <h2>{{ code|safe }}</h2>

</body>
</html>

网页显示:
在这里插入图片描述

first(value)、last(value)和length(value)

       作用: first(value)返回一个序列的第一个元素,例如:names|first
                   last(value)返回一个序列的最后一个元素,例如:names|last
                   length(value)返回一个序列或者字典的长度,例如:names|length
运行测试:

from flask import Flask, render_template

app = Flask(__name__)
app.config['TEMPLATE_AUTO_RELOAD'] = True


@app.route('/')
def index():
    context = {
        'name': 'ycx',
        'age': -16,
        'username': 'Tony',
        'code': '<h3>但行好事,莫问前程</h3>',
        'language': ['Python', 'Java', 'PHP', 'C#']

    }

    return render_template('index.html', **context)


if __name__ == '__main__':
    app.run(debug=True)

模板index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
    <h2>{{ code|safe }}</h2>
    <h2>{{ language|first }}</h2>
    <h2>{{ language|last }}</h2>
    <h2>{{ language|length }}</h2>

</body>
</html>

网页显示:
在这里插入图片描述
还可以嵌套过滤,求列表中某个字符串的长度:
       例如:

    <h2>{{ language|first|length }}</h2>
lower(value)、upper(value)

       作用: lower(value):将字符串转换为小写
                   upper(value):将字符串转换为大写
运行测试:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
    <h2>{{ code|safe }}</h2>
    <h2>{{ name|lower }}</h2>
    <h2>{{ name|upper }}</h2>


</body>
</html>

网页显示:
在这里插入图片描述

replace(value, old, new)

       作用: 将字符串中old字串替换为new字符串
运行测试:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
    <h2>{{name|replace('cx','fl')}}</h2>

</body>
</html>

网页显示:
在这里插入图片描述

truncate(value,length=255,killwords=False)

       作用: 截取length长度的字符串
运行测试:

from flask import Flask, render_template

app = Flask(__name__)
app.config['TEMPLATE_AUTO_RELOAD'] = True


@app.route('/')
def index():
    context = {
        'name': 'ycx',
        'age': -16,
        'username': 'Tony',
        'title': '不乱于心,不困于情。不畏将来,不念过往。如此,安好'
    }

    return render_template('index.html', **context)


if __name__ == '__main__':
    app.run(debug=True)

模板index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
    <h2>{{ title|truncate(length=12) }}</h2>

</body>
</html>

网页显示:
在这里插入图片描述

truncate()过滤器一般用于显示较长的标题省略末尾一部分内容
       •注意:
              truncate()传入的length必须大于等于3,因为3表示省略号3个点,大于3时剩下的显示变量具体内容,小于3时渲染会报错

striptags(value)

       作用: 删除字符串中所有的HTML标签,如果出现多个空格,将替换成一个空格
运行测试:

from flask import Flask, render_template

app = Flask(__name__)
app.config['TEMPLATE_AUTO_RELOAD'] = True


@app.route('/')
def index():
    context = {
        'name': 'ycx',
        'age': -16,
        'username': 'Tony',
        'script':'<script>alert("hello")</script>'
    }

    return render_template('index.html', **context)


if __name__ == '__main__':
    app.run(debug=True)

模板index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
    <h2>{{script | striptags}}</h2>

</body>
</html>

网页显示:
在这里插入图片描述
由网页显示可得:标签都被过滤掉,只显示标签内部内容

wordcount(s)

       作用: 计算一个长字符串中单词的个数,以空格间隔为一个单词
运行测试:

from flask import Flask, render_template

app = Flask(__name__)
app.config['TEMPLATE_AUTO_RELOAD'] = True


@app.route('/')
def index():
    context = {
        'name': 'ycx',
        'age': -16,
        'username': 'Tony',
        'address': '中国 陕西省 西安市 临潼区'
    }

    return render_template('index.html', **context)


if __name__ == '__main__':
    app.run(debug=True)

模板index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask过滤器</title>
</head>
<body>
    <h1>首页</h1>
    <h2>{{ name }}</h2>
    <h2>{{ age|abs }}</h2>
    <h2>{{ username|default('这个人很懒,什么都没有留下...',boolean=true) }}</h2>
    <h2>{{script | striptags}}</h2>
    <h2>{{ address}}</h2>
    <h2>{{ address|wordcount }}</h2>

</body>
</html>

网页显示:
在这里插入图片描述

其他过滤器

       •format(value,*arags,**kwargs)
       格式化字符串
       例如:{{ “%s” - “%s”|format(‘Hello’,“World”) }}将输出Hello - World

       •join(value,d=‘xx’)
       将一个序列用d参数的值拼接成字符串

       •int(value)
       将值转换为int类型

       •float(value)
       将值转换为float类型

       •string(value)
       将变量转换成字符串

       •trim(value)
       截取字符串前面和后面的空白字符

2. 自定义过滤器

除了使用Jinja2模板内置的过滤器,还可以自定义过滤器
       如下示例:
运行测试:

from flask import Flask, render_template

app = Flask(__name__)


@app.route('/')
def cut():
    context = {
        'word': 'Hello World'
    }
    return render_template('cut.html', **context)


@app.template_filter('replace1')
def replace1(value):
    return value.replace(' ', '---')


if __name__ == '__main__':
    app.run(debug=True)

模板cut.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask模板</title>
</head>
<body>
    <h2>{{word}}</h2>
    <h2>{{word|replace1}}</h2>
</body>
</html>

网页显示:
在这里插入图片描述
由上述得:空格被替换为- - -
自定义过滤器相当于定义函数,同时需要用装饰器@app.template_filter(‘replace1’)来装饰,传入的参数即为过滤器名
       •自定义有以下功能的过滤器:
发布一篇博客,当发布时间,小于1分钟,显示刚刚;
大于1分钟小于1小时,显示XX分钟前;
大于1小时小于24小时,显示XX小时前;

运行测试:

from datetime import datetime

from flask import Flask, render_template

app = Flask(__name__)

app.config['TEMPLATE_AUTO_RELOAD'] = True


@app.route('/')
def index():
    context = {
        'release_time1': datetime(2020, 10, 20, 16, 30, 0),
        'release_time2': datetime(2020, 10, 21, 13, 45, 0)
    }
    return render_template('cut.html', **context)


@app.template_filter('time_handler')
def handle_time(time):
    if isinstance(time, datetime):
        now = datetime.now()
        time_delta = (now - time).total_seconds()
        if time_delta < 60:
            return '刚刚写的博客'
        elif (time_delta >= 60) and (time_delta < 60 * 60):
            return '%d分钟之前写的博客' % (time_delta // 60)
        elif (time_delta >= 60 * 60) and (time_delta < 60 * 60 * 24):
            return '%d小时之前写的博客' % (time_delta / 60 // 60)

    else:
        return time


if __name__ == '__main__':
    app.run(debug=True)

模板cut.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask</title>
</head>
<body>
    <h1>以下是博客发表时间:</h1>
    <h2>文章发表时间:{{release_time1}}</h2>
    <h2>文章发表时间:{{release_time1 | time_handler}}</h2>
    <h2>文章发表时间:{{release_time2}}</h2>
    <h2>文章发表时间:{{release_time2 | time_handler}}</h2>
</body>
</html>

网页显示:
在这里插入图片描述

  • 7
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 10
    评论
评论 10
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值