【Flask模版语言Jinja2】--2019-08-06 15:48:34

【Flask模版语言Jinja2】--2019-08-06 15:48:34,第1张

概述目录 流程控制 模版语言转义 在模版中使用Python函数 Jinja2模版复用之block Jinja2模版引用之include Jinja2模板宏定义之macro 原创链接: http://106.13.73.98/__/110/ @(Jinja2模版语言) *** 补充,导入静态文件: <link rel="stylesheet" href="{{ url_for('static', fil

目录

流程控制 模版语言转义 在模版中使用Python函数 Jinja2模版复用之block Jinja2模版引用之include Jinja2模板宏定义之macro

原创链接: http://106.13.73.98/__/110/

@(Jinja2模版语言)
***
补充,导入静态文件:

<link rel="stylesheet" href="{{ url_for('static',filename='CSS/clock.CSS') }}">

Falsk中默认的模版语言是Jinja2
{{}} 引用或执行时使用
{%%} 逻辑使用

流程控制

for语法

{% for foo in g %}    # 逻辑...{% endfor %}

if语法

{% if g %}{% elif g %}    {% else %}    {% endif %}

开始测试
***
我们先准备好后端代码:

from flask import Flask,render_templateapp = Flask(__name__)info = {    1: {'name': '张三','age': '30','gender': '男'},2: {'name': '李四','age': '40','gender': '女'},3: {'name': '王五','age': '50','gender': '未知'},}@app.route('/')def test():    return render_template('test.HTML',info=info)  # 还可以使用下面这种方式传递字典:  # return render_template('test.HTML',**{'info': info})app.run('0.0.0.0',5000,deBUG=True)


开始写前端:

<table border="1px">    <thead>    <tr>        <th>ID</th>        <th>姓名</th>        <th>年龄</th>        <th>性别</th>    </tr>    </thead>    <tbody>    {% for k in info %} {# 循环字典还可用keys,values,items方法 #}        <tr>            <td>{{ k }}</td>            <td>{{ info.get(k).name }}</td>            <td>{{ info[k].get('age') }}</td>            <td>                {% if info[k]['gender'] == '未知' %}                    男                {% else %}                    {{ info[k]['gender'] }}                {% endif %}            </td>        </tr>    {% endfor %}    </tbody></table>


展示效果如下图:



模版语言转义

安全起见,默认传入前端的字符串不会被转义.

从后端入手——Markup
***
后端代码:

from flask import Flask,render_template,Markupapp = Flask(__name__)@app.route('/')def test():    tag = '<label><input type="text" value="我将被转义"></label>'    # 受用Markup在HTML标签上做一层封装,当Jinja2模版语言知道这是一个安全的HTML标签    ret = Markup(tag)    return render_template('test.HTML',ret=ret)app.run('0.0.0.0',deBUG=True)


前端代码:

{{ ret }}


实现效果:

从前端入手——safe
***
后端代码:

from flask import Flask,Markupapp = Flask(__name__)@app.route('/')def test():    tag = '<label><input type="text" value="我将被转义"></label>'    return render_template('test.HTML',tag=tag)app.run('0.0.0.0',deBUG=True)


前端代码:

{{ tag|safe }}


好了,去访问验证吧.
***

在模版中使用Python函数

方法一:使用template_global定义全局函数
***
前端代码:

from flask import Flask,render_templateapp = Flask(__name__)@app.template_global()  # 定义全局模版函数def axb(a,b):    return a * b@app.route('/')def test():    return render_template('test.HTML')app.run('0.0.0.0',deBUG=True)


前端代码:

{{ axb(10,10) }}

方法二:将函数传给前端
***
后端代码:

from flask import Flask,render_templateapp = Flask(__name__)axb = lambda a,b: a * b@app.route('/')def test():    return render_template('test.HTML',axb=axb)app.run('0.0.0.0',deBUG=True)


前端代码:

@H_301_226@{{ axb(10,10) }}
Jinja2模版复用之block

首先要定义一个母版文件index.HTML:

<!DOCTYPE HTML><HTML lang="en"><head>    <Meta charset="UTF-8">    <Title>Title</Title></head><body>    <div>此处省略800行</div>    {% block content %}    {% endblock %}    <div>此处省略800行</div></body></HTML>

然后在其它HTML文件中引用它:

{% extends "index.HTML" %}{% block content %}<div>此处省略800行</div>{% endblock %}
Jinja2模版引用之include

先定义一个代码块:

<form>    用户名:<input type="text" name="user">    密码:<input type="password" name="pwd"></form>

然后在其它HTML文件中引用它:

<!DOCTYPE HTML><HTML lang="en"><head>    <Meta charset="UTF-8">    <Title>Title</Title></head><body>    <div>此处省略800行</div>    {% include "login.HTML" %}    <div>此处省略800行</div></body></HTML>
Jinja2模板宏定义之macro

宏定义一般很少用.

前端代码:

<body>{# 先定义一个函数 #}{% macro type_text(type,name) %}    <input type="{{ type }}" name="{{ name }}" value="{{ name }}">{% endmacro %}{# 调用函数 #}{{ type_text('text','username') }}{{ type_text('password','userpwd') }}</body>

展示效果如下:

总结

以上是内存溢出为你收集整理的【Flask模版语言Jinja2】--2019-08-06 15:48:34全部内容,希望文章能够帮你解决【Flask模版语言Jinja2】--2019-08-06 15:48:34所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/langs/1195377.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-06-03
下一篇 2022-06-03

发表评论

登录后才能评论

评论列表(0条)

保存