AngularJS 日期格式化详解


Posted in Javascript onDecember 23, 2015

AngularJS是为了克服HTML在构建应用上的不足而设计的。HTML是一门很好的为静态文本展示设计的声明式语言,但要构建WEB应用的话它就显得乏力了。所以我做了一些工作(你也可以觉得是小花招)来让浏览器做我想要的事。

AngularJS的日期格式化有两种形式,一种是在HTML页面,一种是在JS代码里,都是用到AngularJS的过滤器$filter。

HTML: date_expression 即 你在$scope中设的date类型变量(注意,一定是date object才正确), 也是要显示出来的日期,|是分割符号,分割符号后面的第一个参数date是指明过滤器类型是过滤日期的,第二个参数format是你的日期要格式化成什么样子,比如yyyy-MM-dd,最后timezone一个是时区(可选参数),对于国际化的网站比较适用。

{{ date_expression | date : format : timezone}}

两种写法:可以用{{}}表达式,也可以用ng-bind 或者 ng-model

{{myDate | date:'medium'}}

<h1 ng-bind="myDate | date:'yyyy-MM-dd'"></h1>

在Javascript代码里,是这么写的:

var myJsDate=$filter('date')($scope.myDate,'yyyy-MM-dd');

这样你声明的变量myJsDate就能得到$scope里myDate格式化之后的值了。

以上内容是小编给大家分享的AngularJS 日期格式化详解的全部叙述,希望大家喜欢。

Javascript 相关文章推荐
jQuery1.5.1 animate方法源码阅读
Apr 05 Javascript
JS实现的省份级联实例代码
Jun 24 Javascript
JavaScript对内存分配及管理机制详细解析
Nov 11 Javascript
禁用JavaScript控制台调试的方法
Mar 07 Javascript
jQuery中die()方法用法实例
Jan 19 Javascript
老生常谈的跨域处理
Jan 11 Javascript
React.js中常用的ES6写法总结(推荐)
May 09 Javascript
详解在Angular项目中添加插件ng-bootstrap
Jul 04 Javascript
Vue 中axios配置实例详解
Jul 27 Javascript
Angular2实现的秒表及改良版示例
May 10 Javascript
使用JavaScript计算前一天和后一天的思路详解
Dec 20 Javascript
js实现验证码干扰(静态)
Feb 22 Javascript
详解JavaScript时间格式化
Dec 23 #Javascript
FullCalendar日历插件应用之数据展现(一)
Dec 23 #Javascript
js实现图片无缝滚动
Dec 23 #Javascript
使用Function.apply()的参数数组化来提高 JavaScript程序性能的技巧
Dec 23 #Javascript
js判断文本框输入的内容是否为数字
Dec 23 #Javascript
javascript新闻跑马灯实例代码
Jul 29 #Javascript
javascript动态添加checkbox复选框的方法
Dec 23 #Javascript
You might like
PR值查询 | PageRank 查询
2006/12/20 PHP
QQ互联一键登录审核不通过的解决方案
2014/09/10 PHP
Thinkphp调用Image类生成缩略图的方法
2015/03/07 PHP
thinkphp3.2.3 分页代码分享
2016/07/28 PHP
Javascript 不能释放内存.
2006/09/07 Javascript
Javascript 跨域访问解决方案
2009/02/14 Javascript
js跳转页面方法实现汇总
2014/02/11 Javascript
javascript实现的图片切割多块效果实例
2015/05/07 Javascript
text-align:justify实现文本两端对齐 兼容IE
2015/08/19 Javascript
跟我学习javascript的prototype原型和原型链
2015/11/18 Javascript
实例详解jQuery Mockjax 插件模拟 Ajax 请求
2016/01/12 Javascript
基于javascript实现按圆形排列DIV元素(三)
2016/12/02 Javascript
概述一个页面从输入URL到页面加载完的过程
2016/12/16 Javascript
深入理解Javascript中的valueOf与toString
2017/01/04 Javascript
微信小程序 登录实例详解
2017/01/16 Javascript
js实现产品缩略图效果
2017/03/10 Javascript
详解JS中的柯里化(currying)
2017/08/17 Javascript
JS生成随机打乱数组的方法示例
2017/12/23 Javascript
jQuery实现右侧抽屉式在线客服功能
2017/12/25 jQuery
javascript实现文件拖拽事件
2018/03/29 Javascript
nodejs同步调用获取mysql数据时遇到的大坑
2019/03/02 NodeJs
Vue使用.sync 实现父子组件的双向绑定数据问题
2019/04/04 Javascript
详解JavaScript实现动态的轮播图效果
2019/04/29 Javascript
JavaScript Array对象基本方法详解
2019/09/03 Javascript
layer.open 获取不到表单信息的解决方法
2019/09/26 Javascript
[39:08]完美世界DOTA2联赛PWL S3 LBZS vs CPG 第一场 12.12
2020/12/16 DOTA
wxpython 学习笔记 第一天
2009/02/09 Python
机器学习实战之knn算法pandas
2019/06/22 Python
Pyinstaller 打包exe教程及问题解决
2019/08/16 Python
python新手学习使用库
2020/06/11 Python
PyCharm 2020.2下配置Anaconda环境的方法步骤
2020/09/23 Python
HTML5是什么 HTML5是什么意思 HTML5简介
2012/10/26 HTML / CSS
aden + anais英国官网:美国婴儿贴身用品品牌
2019/09/08 全球购物
群众路线自我剖析及整改措施
2014/11/04 职场文书
详解Python 3.10 中的新功能和变化
2021/04/28 Python
Python采集股票数据并制作可视化柱状图
2022/04/04 Python