2.1 Flask渲染Jinja2模板和传参
(1)如何渲染模板
* 模板放在'templates'文件夹下。(如新建个'index.html'文件)
* 从'flask'中导入'render_template'函数。
* 在视图函数中使用'render_template'函数,渲染模板,注意:只需填写模板名称,不要填写templates这个文件夹的路径,因为该文件夹是项目默a认的静态文件目录。当然,如果某模板不是直接在templates文件夹下,而是在templates文件夹下的某文件夹内,如在'/templates/f34edxc older1/index.html',则要写为'render_template('folder1/index.html')'
(2)模板传参数
* 如果只有一个或少量参数,直接在'render_template'函数中添加关键字参数即可,return render_template('index.html', key1='string1', key2='string2')
* 如果有多个参数,则可以先把所有的参数放在字典中,然后将改字典作为参数传递,注意传递时需要加两个星号:return render_template('index.html', **content),其中content是字典名。这样传值方式代码更方便管理和使用。
.py文件代码如下:
from flask import Flask, render_template, url_for
app = Flask(__name__)
@app.route('/')
def index():
#定义一个字典,用来放参数
content = {
'username':'张三',
'gender':'男',
'age':18
}
return render_template('index.html', **content) #注意index.html文件直接在'templates'文件夹下,第二个参数content是字典名,不要遗漏两个星号。
if __name__ == '__main__':
app.run(debug=True)
index.html文件代码如下:(index.html文件在templates文件夹下)
(注意如何引用传递过来的参数)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
这是HTML中出现的文字!
{# 注释:引用username、gender……等传过来的参数,用两个花括号 #}
<p>用户名:{{ username }}</p>
<p>性别:{{ gender }}</p>
<p>年龄:{{ age}}</p>
</body>
</html>
注意:* {# #} 为Jinja2在HTML中的的单行注释语法
* {{ }} 两对花括号是Jinja2语法用来取传过来的参数的值
2.2 模板中访问属性和字典
* 在模板中,如果要使用一个变量,语法是:'{{ params }}'
* 访问模型中的属性或者是字典,可以通过'{{ params.property }}' ,或者是使用'{{ params['property '] }}'
.py 文件示例代码如下:
from flask import Flask, render_template, url_for
app = Flask(__name__)
@app.route('/')
def index():
# 定义一个Person类
class Person(object):
name = '李四'
age = 20
p = Person() # 实例化一个对象p
# 定义一个字典,用来放参数
content = {
'username': '张三',
'gender': '男',
'age': 18,
'person': p, # 刚才实例化的对象p
'websites': {
'baidu': 'www.baidu.com',
'google': 'www.google.com'
}
}
return render_template('index.html', **content) # 注意index.html文件直接在'templates'文件夹下,第二个参数content是字典名,不要遗漏两个星号。
if __name__ == '__main__':
app.run(debug=True)
.html文件示例代码如下:(注意如何引用传递过来的参数)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
这是HTML中出现的文字!
<p>用户名:{{ username }}</p>
<p>性别:{{ gender }}</p>
<p>年龄:{{ age}}</p>
<br>
<hr>
<h3>引用字典中的类:</h3><br>
第一种引用方式:
<p>姓名:{{ person.name}}</p>
<p>年龄:{{ person.age}}</p>
第二种引用方式:<br>
<p>姓名:{{ person['name']}}</p>
<p>年龄:{{ person['age']}}</p>
<hr>
<h3>引用字典中的字典:</h3><br>
第一种引用方式:
<p>百度:{{ websites.baidu}}</p>
<p>谷歌:{{ websites.google}}</p>
第二种引用方式:<br>
<p>百度:{{ websites['baidu']}}</p>
<p>谷歌:{{ websites['google']}}</p>
</body>
</html>
浏览器观察效果如下:
以上笔记来源于知了课堂黄勇老师讲解的教学视频《Flask框架入门到实战开发》的第二章第1-2小结的学习笔记