Python Flask 编程 | 连载 06 - Jinja2 语法

简介: Python Flask 编程 | 连载 06 - Jinja2 语法

一、Jinja2 模板变量

上下文处理器

上下文处理器 context_processor 可以在模板上下文中添加新的内容,添加的内容可以是变量,也可以是函数。

在 app.py 中新增一个视图函数。

# 其余代码不变
@app.context_processor
def inject_var():
    print("inject_var 方法被调用")
    data = {"username": "stark"}
    return data
复制代码

在 object.html 页面中使用上面视图函数中定义的变量,在 body 标签中增加如下内容:

<h2>通过上下文处理器添加的变量</h2>
<p>{{ username }}</p>
复制代码

保存代码,浏览器访问 /object

image.png

需要注意的是:

  • context_processor 作为一个装饰器修饰一个函数。
  • 函数的返回结果必须是 dict,届时 dict 中的 key 将作为变量在所有模板中可见。

模板变量的使用

模板引擎渲染页面大概有以下几个步骤:

  1. 从磁盘中读取 HTML 字符串
  2. 将满足特定规则的内容进行替换
  3. 发送给浏览器进行展示

在替换内容时字典,元组,列表数据结构在模板中也可以使用 {{ var }} 来获取变量的值。

字符串、整数和浮点数数据类型的渲染

在 app.py 中新建一个视图函数 render_smiple_data。

@app.route('/render_simple_data')
def render_simple_data():
    name = 'Thor'
    age = 1500
    score = 90.00
    return render_template('data.html', name=name, age=age, score=score)
复制代码

在 templates 文件夹中创建 data.html 页面。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <title>Render Data</title>
</head>
<body>
    <h1>Render Data</h1>
    <h3> name: {{ name }}</h3>
    <h3> age: {{ age }}</h3>
    <h3> score: {{ score }}</h3>
</body>
</html>
复制代码

保存代码,浏览器访问 /render_simple_data

image.png

字符串、整数和浮点数等基本数据类型都被渲染出来。

字典数据类型的渲染

而对于字典类型的数据,则可以使用 {{ dict.key }} 或者 {{ dict['key']}} 来渲染指定 Key 对应的 Value

新增视图函数 render_complex_data,将字典类型的数据传给前端。

@app.route('/render_complex_data')
def render_complex_data():
    info = {
        'name': 'stark',
        'age': 40,
        'gender': 'M',
        'address': 'NYC'
    }
    return render_template('data.html', heros=heros, info=info)
复制代码

在 data.html 中增加对字典的展示,在 body 标签中增加如下内容:

<h2>Render Dict</h2>
<h3>info字典:{{ info }}</h3>
<h3>info字典中的name属性值为:{{ info.name }}</h3>
<h3>info字典中的address属性值为:{{ info['address'] }}</h3>
复制代码

保存代码,浏览器访问 /render_complex_data

image.png

列表和元组数据类型的渲染

针对 list 和 tuple 类型的数据索引来获取指定位置的元素。

在视图函数 render_complex_data 中增加一个存储列表类型的变量,并返回给前端。

# 其余代码保持不变
@app.route('/render_complex_data')
def render_complex_data():
    heros = ['stark', 'thor', 'clint', 'banner']
    return render_template('data.html', heros=heros, info=info)
复制代码

在 data.html 的 body 标签中增加如下代码:

<h2>Render List</h2>
<h3>heros列表的内容为:{{ heros }}</h3>
<h3>heros列表中的索引为1的值是:{{ heros[1] }}</h3>
<h3>heros列表中的最后一个值是:{{ heros[-1] }}</h3>
复制代码

保存代码,浏览器访问 /render_complex_data

image.png

嵌套数据类型的渲染

针对嵌套类型的数据,如列表嵌套字典的渲染,根据获取的元素的类型一层一层的获取目标数据。

新增视图函数 render_nest_data,该函数中返回给前端一个列表嵌套字典的数据。

@app.route('/render_nest_data')
def render_nest_data():
    heros_info = [
        {'name': 'stark', 'address': 'New York'},
        {'name': 'thor', 'address': 'Asgard'},
        {'name': 'strange', 'address': 'New York'},
        {'name': 'peter', 'address': 'New York Queens'},
    ]
    return render_template('data.html', heros_info=heros_info)
复制代码

将 data.html 中 body 标签的内容替换为如下内容:

<h1>Render Data</h1>
<h2>Render Nest Data</h2>
<h3>heros_info 列表的内容为:{{ heros_info }}</h3>
<h3>heros_info 列表中的索引为1的字典的 name 属性值:{{ heros_info[1]['name'] }}</h3>
<h3>heros_info 列表中的最后一个字典的 address 属性值:{{ heros_info[-1]['address'] }}</h3>
复制代码

保存代码,浏览器访问 /render_nest_data

image.png

二、Jinja2 模板语法

模板标签

模板标签可以理解为模板中的一些关键字,比如在模板中实现循环、赋值或者条件判断等,模板标签由大括号和%组成,有的标签会带有结束标签,有的则没有。

{% TAG %}
{% TAG1 %}
{% endTAG1 %}
复制代码

条件判断表达式

{% if A %}
    {# 满足A条件 #}
{% elif B %}
    {# 满足B条件 #}
{% else %}
    {# 满足其他条件 #}
{% endif %}
{% if value is xxx %}
    {# 符合条件要展示的内容或者执行的代码 #}
{% endif %}
复制代码

模板中使用 {#  #} 来包裹作为注释的内容

模板中包含了一些内置的判断条件,如:

  • defined/undefined,变量是否已定义
  • none,变量是否为none
  • number/string/even/odd, 是否是数字、字符串、奇数或者偶数
  • upper/lower,是否大小写

模板中可以使用如 and、or、==、!=、>、<、in、not in 等逻辑判断符进行条件判断

在 app.py 中新增视图函数 tag。

@app.route('/tag')
def tag():
    name='stark'
    return render_template('tag.html', name=name)
复制代码

在 templates 目录下新增 tag.html。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <title>Tag</title>
</head>
<body>
    <h2> == 逻辑判断符的使用</h2>
    {% if name == 'stark' %}
        <p>I am Iron Man</p>
    {% else %}
        <p> I am not Iron Man</p>
    {% endif %}
</body>
</html>
复制代码

浏览器访问 /tag

image.png

在 tag.html 的 body 标签中增加代码。

<h2> defined 判断条件的使用</h2>
{% if age is defined %}
    <p>age变量已经被定义</p>
{% else %}
    <p>age变量没有被定义</p>
{% endif %}
复制代码

浏览器再次访问 /tag

image.png

视图函数中是没有定义 age 变量的,所以页面中输出 age 没有被定义。


相关文章
|
17天前
|
人工智能 数据可视化 数据挖掘
探索Python编程:从基础到高级
在这篇文章中,我们将一起深入探索Python编程的世界。无论你是初学者还是有经验的程序员,都可以从中获得新的知识和技能。我们将从Python的基础语法开始,然后逐步过渡到更复杂的主题,如面向对象编程、异常处理和模块使用。最后,我们将通过一些实际的代码示例,来展示如何应用这些知识解决实际问题。让我们一起开启Python编程的旅程吧!
|
16天前
|
存储 数据采集 人工智能
Python编程入门:从零基础到实战应用
本文是一篇面向初学者的Python编程教程,旨在帮助读者从零开始学习Python编程语言。文章首先介绍了Python的基本概念和特点,然后通过一个简单的例子展示了如何编写Python代码。接下来,文章详细介绍了Python的数据类型、变量、运算符、控制结构、函数等基本语法知识。最后,文章通过一个实战项目——制作一个简单的计算器程序,帮助读者巩固所学知识并提高编程技能。
|
4天前
|
Unix Linux 程序员
[oeasy]python053_学编程为什么从hello_world_开始
视频介绍了“Hello World”程序的由来及其在编程中的重要性。从贝尔实验室诞生的Unix系统和C语言说起,讲述了“Hello World”作为经典示例的起源和流传过程。文章还探讨了C语言对其他编程语言的影响,以及它在系统编程中的地位。最后总结了“Hello World”、print、小括号和双引号等编程概念的来源。
98 80
|
3天前
|
分布式计算 大数据 数据处理
技术评测:MaxCompute MaxFrame——阿里云自研分布式计算框架的Python编程接口
随着大数据和人工智能技术的发展,数据处理的需求日益增长。阿里云推出的MaxCompute MaxFrame(简称“MaxFrame”)是一个专为Python开发者设计的分布式计算框架,它不仅支持Python编程接口,还能直接利用MaxCompute的云原生大数据计算资源和服务。本文将通过一系列最佳实践测评,探讨MaxFrame在分布式Pandas处理以及大语言模型数据处理场景中的表现,并分析其在实际工作中的应用潜力。
17 2
|
16天前
|
小程序 开发者 Python
探索Python编程:从基础到实战
本文将引导你走进Python编程的世界,从基础语法开始,逐步深入到实战项目。我们将一起探讨如何在编程中发挥创意,解决问题,并分享一些实用的技巧和心得。无论你是编程新手还是有一定经验的开发者,这篇文章都将为你提供有价值的参考。让我们一起开启Python编程的探索之旅吧!
41 10
|
17天前
|
IDE 程序员 开发工具
Python编程入门:打造你的第一个程序
迈出编程的第一步,就像在未知的海洋中航行。本文是你启航的指南针,带你了解Python这门语言的魅力所在,并手把手教你构建第一个属于自己的程序。从安装环境到编写代码,我们将一步步走过这段旅程。准备好了吗?让我们开始吧!
|
16天前
|
人工智能 数据挖掘 开发者
探索Python编程之美:从基础到进阶
本文是一篇深入浅出的Python编程指南,旨在帮助初学者理解Python编程的核心概念,并引导他们逐步掌握更高级的技术。文章不仅涵盖了Python的基础语法,还深入探讨了面向对象编程、函数式编程等高级主题。通过丰富的代码示例和实践项目,读者将能够巩固所学知识,提升编程技能。无论你是编程新手还是有一定经验的开发者,这篇文章都将为你提供有价值的参考和启示。让我们一起踏上Python编程的美妙旅程吧!
|
4月前
|
搜索推荐 数据可视化 数据挖掘
基于Python flask框架的招聘数据分析推荐系统,有数据推荐和可视化功能
本文介绍了一个基于Python Flask框架的招聘数据分析推荐系统,该系统具备用户登录注册、数据库连接查询、首页推荐、职位与城市分析、公司性质分析、职位需求分析、用户信息管理以及数据可视化等功能,旨在提高求职者的就业效率和满意度,同时为企业提供人才匹配和招聘效果评估手段。
124 0
基于Python flask框架的招聘数据分析推荐系统,有数据推荐和可视化功能
|
2月前
|
JSON 测试技术 数据库
Python的Flask框架
【10月更文挑战第4天】Python的Flask框架
|
2月前
|
存储 SQL 数据库
使用Python和Flask框架创建Web应用
【10月更文挑战第3天】使用Python和Flask框架创建Web应用
43 1
下一篇
DataWorks