从零开始学Flask框架-004
Flask-Moment
pip install flask-moment
除了moment.js,Flask-Moment 还依赖jquery.js。但是Bootstrap 已经引入了jquery.js,因此只需引入moment.js 即可。
templates/base.html:引入moment.js 库
{% extends "bootstrap/base.html" %}
{% import "bootstrap/wtf.html" as wtf %}
{% block title %}Flasky{% endblock %}
{#引入moment.js 库#}
{% block scripts %}
{{ super() }}
{{ moment.include_moment() }}
{% endblock %}
{#包含导航条的程序基模板#}
{% block navbar %}
<div class="navbar navbar-inverse" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle"
data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">TEST</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="/">Home</a></li>
</ul>
</div>
</div>
</div>
{% endblock %}
{% block content %}
<div class="container">
{% block page_content %}{% endblock %}
</div>
{% endblock %}
templates/index.html:
{% extends "base.html" %}
{% block title %}IndexTitle{% endblock %}
<div class="container">
{% block page_content %}
<h1>Hello Flask!</h1>
<p>本地时间格式化:{{ moment(current_time).format('YYYY-MM-DD HH:mm:ss') }}.</p>
<p>本地时间格式化:{{ moment(current_time).format('YYYY-MM-DD') }}.</p>
<p>本地时间格式化:{{ moment(current_time).format('YYYY') }}.</p>
{# {{ wtf.quick_form(form) }}#}
{# 你刚输入的姓名是:#}
{# {{ name }}#}
{% endblock %}
</div>
index.py
from flask import Flask,render_template
from flask_bootstrap import Bootstrap
from flask import request,url_for
from flask_moment import Moment
from datetime import datetime #初始化
app = Flask(__name__)
bootstrap = Bootstrap(app)
# 初始化实例
moment = Moment(app) #路由,处理URL 和函数之间关系的程序称为路由
@app.route('/')
#视图函数,函数执行,返回结果
def index():
return render_template('index.html',current_time=datetime.utcnow()) #启动服务器
if __name__ == '__main__':
app.run()
从零开始学Flask框架-004的更多相关文章
- 从零开始学Flask框架-007
Flash消息 from flask import flash 渲染Flash消息,在基模板base.html中引入get_flashed_messages() {% extends "bo ...
- 从零开始学Flask框架-006
重定向和用户会话 因为刷新页面时浏览器会重新发送之前已经发送过的最后一个请求.如果这个请求是一个包含表单数据的POST 请求,刷新页面后会再次提交表单. 基于这个原因,最好别让Web 程序把POST ...
- 从零开始学Flask框架-005
表单 Flask-WTF 项目结构 pip install flask-wtf 为了实现CSRF 保护,Flask-WTF 需要程序设置一个密钥.Flask-WTF 使用这个密钥生成加密令牌,再用令牌 ...
- 从零开始学Flask框架-003
index.py from flask import Flask,render_template from flask_bootstrap import Bootstrap #初始化 app = Fl ...
- 从零开始学Flask框架-002
Jinja2模板 默认情况下,Flask 在程序文件夹中的templates 子文件夹中寻找模板. Jinja2 中的extends 指令从Flask-Bootstrap 中导入bootstrap/b ...
- 从零开始学Flask框架-001
新建项目 目录结构 Index.html <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- 从零开始学Flask框架-008
数据库 安装Flask-SQLAlchemy扩展库 pip install flask-sqlalchemy 引入SQLAlchemy类 from flask_sqlalchemy import SQ ...
- 从零开始学 Java - 搭建 Spring MVC 框架
没有什么比一个时代的没落更令人伤感的了 整个社会和人都在追求创新.进步.成长,没有人愿意停步不前,一个个老事物慢慢从我们生活中消失掉真的令人那么伤感么?或者说被取代?我想有些是的,但有些东西其实并不是 ...
- 4. 使用别的json解析框架【从零开始学Spring Boot】
转载:http://blog.csdn.net/linxingliang/article/details/51585921 此文章已经废弃,请看新版的博客的完美解决方案: 78. Spring Boo ...
随机推荐
- 一段js MD5。加密 转换C#语法过程
A 帮忙把这段js脚本转换 c#语言. JS: function md5 (bit,sMessage) {debugger //var sMessage = this; function Rotate ...
- JavaWeb之基础(1) —— 文件、目录结构和创建项目
1. JavaWeb应用 JavaWeb应用从大类上分为静态和动态两种. 静态应用就是传统的HTML文件+素材资源构造的静态网页,不需要特殊的配置.JavaWeb也不是专门用来做静态网站的. 动态应用 ...
- 【多线程与并发】:Java中的锁
锁的概念 锁是用来控制多个线程访问共享资源的方式,一般来说,一个锁可以防止多个线程同时访问共享资源(但有些锁可以允许多个线程并发的访问共享资源,如读写锁). 在JDK1.5之前,Java是通过sync ...
- java.util之一:ArrayList
ArrayList是java中的线性结构的一种表示方法,在java中使用频率非常高,下面来一步一步分析其底层的实现.(JDK1.8) 一.构造函数 ArrayList的构造函数有三个,分别如下, 我们 ...
- python统计apache、nginx访问日志IP访问次数并且排序(显示前20条)【转】
前言:python统计apache.nginx访问日志IP访问次数并且排序(显示前20条).其实用awk+sort等命令可以实现,用awk数组也可以实现,这里只是用python尝试下. apach ...
- Numpy中ndim、shape、dtype、astype的用法
本文链接:https://blog.csdn.net/Da_wan/article/details/80518725本文介绍numpy数组中这四个方法的区别ndim.shape.dtype.astyp ...
- java项目代码上线
java项目代码上线 1:java项目代码上线架构图 ip地址及主机名规划 10.0.0.11 deploy 10.0.0.12 tomcat-web01 10.0.0.13 git.oldboy ...
- git如何将旧commit的相关notes复制到新commit?
答: git notes copy <old-commit> <new-commit>
- Vue CLI3和Vue CLI2环境搭建
关于 Vue CLI 旧版本的安装以及创建项目 1.搭建 vue 的开发环境 ,安装 vue 的脚手架工具 官方命令行工具 npm install --global vue-cli / cnpm in ...
- maven项目新检出后不编译爬坑记 及 mvn clean package报错 WagonTransporterFactory: java.util.NoSuchElementException 异常【我】
从SVN新检出一个maven项目,配置好后,发现项目无法编译(只有一个test包中的代码显示编译报错,其他所有包中的代码都不编译,也不报错), 先注释掉报错的test包中的所有内容, 用Eclipse ...