当前位置: 首页 > news >正文

Flask基础2-Jinja2模板

目录

1.介绍

2.模板传参

1.变量传参

 2.表达式

3.控制语句

4.过滤器

5.自定义过滤器

 6.测试器

7.块和继承


1.介绍

Jinja2:是Python的Web项目中被广泛应用的模板引擎,是由Python实现的模板语言,Jinja2 的作者也是 Flask 的作 者。他的设计思想来源于Django的模板引擎,并扩展了其语法和一系列强大的功能,其是Flask内置的模板语言。 jinja2之所以被广泛使用是因为它具有以下优点:

1、相对于Template,jinja2更加灵活,它提供了控制结构,表达式和继承等。

2、相对于Mako,jinja2仅有控制结构,不允许在模板中编写太多的业务逻辑。

3、相对于Django模板,jinja2性能更好。

4、Jinja2模板的可读性很棒。 要渲染一个模板,通过 render_template 方法即可。

2.模板传参

在渲染前端页面的时候,有时候我们要将后端的一些数据渲染到前端页面,那么在使用render_template渲染模板的时候,可以传递关键字参数,前端页面直接使用,如果是多个参数就写成字典或者列表的形式传递到前端

1.变量传参

传参语法:在前端页面中{{变量名}}两个大括号中写变量名即可

逻辑语句(if else for之类的)使用{% if%}这个符号

from flask import Flask
from flask import render_template,redirect,requestapp=Flask(__name__)data={'name':'zhangsan','age':18,'weight':100}
datas={'a':{'name':'lisi','age':19,'weight':101},'b':{'name':'wangwu','age':20,'weight':110},'c':{'name':'zhangsan','age':18,'weight':100}
}@app.route('/index')
def index():return render_template('index.html',**datas)if __name__ == '__main__':app.run(debug=True)

传入data的写法 

 传入datas的写法:

 2.表达式

其实就是{{表达式}},表达式可以是运算表达式{{1+1}},可以是比较表达式{{age>18}}

还可以是函数{{ function() }}

3.控制语句

主要用到的是:条件控制语句if和else,循环语句for

条件控制语句要用{% if %},并且在结束的时候要加上{% endif %},{% endfor %}

    {% if name=='zhangsan' %}<h1>这里是法外狂徒的地方,其他人不能来</h1>{% elif name=='lisi' %}<h1>这里是李四的地盘</h1>{% else %}<h1>其他人的根据地</h1>{% if age>18 %}<h1>成年人</h1>{%endif%}{# 循环语句 #}{% for name in datas %}我的名字是:{{ name }},我今年:{{ age }},我体重为:{{ weight }}{% endfor %}

3.过滤器

就是一个转换函数,将传入的变量传入到中国转换函数中,在使用这个转换函数的返回值作为渲染变量,语法:{{ 变量名 | 转换函数 }}

常用的有:

safa:渲染时值不转义

capitalize:把值的首字母转换成大写,其他的小写

lower:所有字母小写

upper:所有字母大写

title:把值的每个单词首字母大写

trim:去除首位空格

striptags:渲染之前把值的所有HTML标签删除

escape:不转义HTML语法

join:替换字符串的值

replace:默认对数字进行四舍五入,也可以用参数进行控制

int:把值转成整形

    <p>{{ name | upper }}</p><p>{{ name | trim }}</p><p>{{ "HELLO WROLD" | lower }}</p><p>{{ '<h1>name<h1>' | safe }}</p><p>{{ '<h1>name<h1>' | escape }}</p>

 其实python基础中用到的内置函数这里基本都有

    <p>{{ age | round }}</p><p>{{ age | abs }}</p><p>{{ age | length }}</p><p>{{ age | sum }}</p><p>{{ age | sort }}</p>

4.自定义过滤器

 使用函数写一个自己想要的函数,然后将这个函数传入到flask中存放过滤器的地方,那么你这个函数就是过滤器了


# 第一种方法
def get_last_num(num):return num[-1]app.jinja_env.filters['last_name']=get_last_num# 第二种方式,使用过滤器函数的装饰器
@app.finalize_request()
def get_last_num(num):return num[-1]

然后就可以在前端页面中使用这个过滤器了

 5.测试器

和过滤器差不多,但是测试器是放在结构语句中判断的

{% if name is lower %}<h2>"{{ name }}" 是小写的.</h2>
{% endif %}

jinja2中的内置的测试器:

{# 检查是否所有字符都是大写 #}
{% if name is upper %}<h2>"{{ name }}" 所有字母大写.</h2>
{% endif %}
{# 检查变量是否为空 #}
{% if name is none %}<h2>name值是空的.</h2>
{% endif %}
{# 检查变量是否为字符串,也可以用number检查是否为数值 #}
{% if name is string %}<h2>{{ name }} name是字符串.</h2>
{% endif %}

自定义测试器

def is_9num(num):mox=r'\d{9}'return re.match(mox,num)
app.jinja_env.tests['is_9num'] = is_9num@app.template_test('is_9num')
def is_9num(str, suffix):return str.lower().startswith(suffix.lower())

6.块和继承

这个是为了解决代码重用的,比如首页,页脚,导航栏之类的

父模板中写重复的代码块

子模板中继承父模板的内容后来填充,转义父模板中的内容就不用重复写了

继承的时使用关键字extends

标签定义的内容写到{% block 块变量名称 %} {% endblock %}中,举个栗子:

父模板(father.heml)内容:

{% block top %}页首内容
{% endblock top %}{% block centent %}留给子模板写的标签
{% endblock centent%}{% block bottom %}页脚内容
{% endblock bottom%}

 子模板中写:

{% extend 'father.html' %}
{% block content %}需要填写的内容
{% endblock content %}


 

相关文章:

  • git版本控制工具常用命令
  • 推荐一款WPF绘图插件OxyPlot
  • C语言 RTC时间(年月日时分秒) 和 时间戳 互相转换
  • Java的一些补充性介绍
  • java:测试hystrix的一些关键参数
  • linux常用的基础命令
  • i.MX8MP平台开发分享(RDC软件配置篇)
  • Ubuntu项目部署
  • java aio nio区别
  • 【教程】从0开始搭建大语言模型:实现Attention机制
  • GEO ISP图像调试-PFC(蓝紫边校正)
  • 2024最新最全【大模型】人工智能零基础入门到精通,看完这一篇就够了!
  • DOS 命令
  • android 开机动画执行流程
  • pdf文件怎么改变大小?在线快速压缩pdf的方法
  • 分享一款快速APP功能测试工具
  • [iOS]Core Data浅析一 -- 启用Core Data
  • 【跃迁之路】【641天】程序员高效学习方法论探索系列(实验阶段398-2018.11.14)...
  • avalon2.2的VM生成过程
  • extjs4学习之配置
  • gulp 教程
  • JavaScript服务器推送技术之 WebSocket
  • OSS Web直传 (文件图片)
  • 道格拉斯-普克 抽稀算法 附javascript实现
  • 基于组件的设计工作流与界面抽象
  • 理解IaaS, PaaS, SaaS等云模型 (Cloud Models)
  • 免费小说阅读小程序
  • 爬虫模拟登陆 SegmentFault
  • 如何优雅地使用 Sublime Text
  • 腾讯大梁:DevOps最后一棒,有效构建海量运营的持续反馈能力
  • 微信支付JSAPI,实测!终极方案
  • 小程序 setData 学问多
  • gunicorn工作原理
  • 支付宝花15年解决的这个问题,顶得上做出十个支付宝 ...
  • ​​​​​​​​​​​​​​Γ函数
  • ‌[AI问答] Auto-sklearn‌ 与 scikit-learn 区别
  • #Lua:Lua调用C++生成的DLL库
  • #大学#套接字
  • (1)Nginx简介和安装教程
  • (10)Linux冯诺依曼结构操作系统的再次理解
  • (11)MSP430F5529 定时器B
  • (51单片机)第五章-A/D和D/A工作原理-A/D
  • (Java实习生)每日10道面试题打卡——JavaWeb篇
  • (笔记)M1使用hombrew安装qemu
  • (二)测试工具
  • (附源码)spring boot北京冬奥会志愿者报名系统 毕业设计 150947
  • (附源码)spring boot基于Java的电影院售票与管理系统毕业设计 011449
  • (附源码)计算机毕业设计ssm高校《大学语文》课程作业在线管理系统
  • (黑客游戏)HackTheGame1.21 过关攻略
  • (计算机网络)物理层
  • (紀錄)[ASP.NET MVC][jQuery]-2 純手工打造屬於自己的 jQuery GridView (含完整程式碼下載)...
  • (顺序)容器的好伴侣 --- 容器适配器
  • (一)WLAN定义和基本架构转
  • (转)socket Aio demo
  • (转载)Google Chrome调试JS