zoukankan      html  css  js  c++  java
  • Flask学习 二 模板

    jinja2模版

    from flask import Flask,render_template
    
    app = Flask (__name__)
    
    
    @app.route ('/<name>')
    def index(name):
        return render_template('index.html',name=name)
    
    @app.route ('/user/<name>')
    def user(name):
        return render_template('user.html',name=name)
    
    if __name__ == '__main__':
        app.run (debug=True)
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    Hello! {{ name|capitalize }}
    </body>
    </html>

    jinja2 能识别所有类型的变量,比如列表,字典,对象

    <p>{{ mylist[3]}}</p>
    <p>{{ mydict['key']}}</p>
    <p>{{ mylist['key']}}</p>
    <p>{{ myobj.somemethod() }}</p>

    过滤器

    safe    渲染值时不转义
    capitalize 把值的首字母转换成大写,其他字母小写
    lower      把值转换成小写形式
    upper     把值转换成大写形式
    title       把值中每个单词的首字母变成大写
    trim      把值的首尾空格去掉
    striptags  渲染之前把所有的HTML标签都删除

    控制结构

    if条件控制

    {% if user %}
        hello {{ user }}
    {% else %}
        hello,stranger!
    {% endif %}
    for 循环
    <
    ul> {% for comment in comments %} <li>{{ comment }}</li> {% endfor %} </ul>

    宏(函数)

    {% macro render_comment(comment) %} #声明一个宏(函数)
        <li>{{ comment }}</li>    # return 值
    {% endmacro %}  #结束
    
    <ul>
        {% for comment in comments %}
            {{ render_comment(comment) }}  #调用宏
        {% endfor %}
    </ul>

    导入宏

    {% import 'macros.html' as macros %}
    <ul>
        {% for comment in comments %}
            {{ macros.render_comment(comment) }}
        {% endfor %}
    </ul>

    模版继承

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        {% block head %}
        <title>{% block title %}{% endblock %}- my application</title>
        {% endblock %}
    </head>
    <body>
    {% block body %}
    {% endblock %}
    </body>
    </html>
    base html
    {% extends 'base.html' %}
    
    {% block title %}Index{% endblock %}
    {% block head %}
        {{ super() }}
        <style>
        </style>
    {% endblock %}
    {% block body %}
        <h1>hello,world!</h1>
    {% endblock %}
    index html

    使用flask-bootstrap 集成Bootstrap

    pip install flask-bootstrap

    安装后即可继承使用Bootsftrap所有文件的基模版

    app
    user.html

     bootstrap 中scripts和styles块如果想添加新内容,必须使用super()函数

    {% block scripts %}
        {{ super() }}
        <script type="text/javascript" src = 'myscript.js'></script>
    {% endblock %}

     自定义错误页面

    app
    base.html
    404

     url_for()

    url_for('index',_external=true) 返回绝对路径

    base 模版添加icon图标

    添加ico图标

     falsk-moment本地化日期和时间

    pip install flask-moment

    from flask_moment import Moment
    from datetime import datetime
    moment = Moment(app)
    
    @app.route ('/')
    def index1():
        return render_template('index.html',current_time = datetime.utcnow())
    
    
    if __name__ == '__main__':
        app.run (debug=True)
    base.html
    <p>本地时间和日期是{{ moment(current_time).format('LLL') }}</p>
     <p>那是{{ moment(current_time).fromNow(refresh=True) }}</p>

    format('LLL')对应的不同复杂度

    fromNow会显示相对时间戳

    flask-moment 包含format()、fromNow()、fromTime()、calendar()、valueOf()、unix()

    常用格式化参数

    设置语言

    <!--使用中文,默认是英语的-->
    {{ moment.lang("zh-CN") }} 

    在模版中渲染,如:
    <p>现在时间时: {{ moment().format('YYYY年M月D日, hh:mm:ss a') }}.</p>
    hh:mm:ss 12小时制,
    HH:mm:ss 24小时制
    <p>已经过去了: {{ moment().fromTime(time) }}.</p> <p>{{ moment().calendar() }}.</p>

    结果
    现在时间时: 2015年4月22日, 10:06:33 上午.
    
    已经过去了: 21年内.
    
    今天上午10点06.

  • 相关阅读:
    Word操作——通配符
    圆的拟合
    最优化案例整理
    机器学习数学基础知识备忘
    scikit-learn学习笔记
    Linux下安装scikit-learn
    ROS学习备忘
    [ROS]激光驱动安装
    CMake和Linux编程:find_package的使用
    [OpenCV]直线拟合
  • 原文地址:https://www.cnblogs.com/Erick-L/p/6873129.html
Copyright © 2011-2022 走看看