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 相关文章推荐
JavaScript 实现模态对话框 源代码大全
May 02 Javascript
动态加载JS文件的三种方法
Nov 08 Javascript
原生javascript实现图片弹窗交互效果
Jan 12 Javascript
jQuery中大家不太了解的几个方法
Mar 04 Javascript
jQuery获得document和window对象宽度和高度的方法
Mar 25 Javascript
基于JavaScript实现表单密码的隐藏和显示出来
Mar 02 Javascript
React应用中使用Bootstrap的方法
Aug 15 Javascript
vue组件文档(.md)中如何自动导入示例(.vue)详解
Jan 25 Javascript
基于 jQuery 实现键盘事件监听控件
Apr 04 jQuery
解决微信小程序调用moveToLocation失效问题【超简单】
Apr 12 Javascript
vue开发简单上传图片功能
Jun 30 Javascript
Vue实现小购物车功能
Dec 21 Vue.js
详解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
递归列出所有文件和目录
2006/10/09 PHP
发一个php简单的伪原创程序,配合商城采集用的
2010/10/12 PHP
ThinkPHP之getField详解
2014/06/20 PHP
如何运行/调试你的PHP代码
2020/10/23 PHP
一个简单的javascript类定义例子
2009/09/12 Javascript
E3 tree 1.6在Firefox下显示问题的修复方法
2013/01/30 Javascript
瀑布流布局并自动加载实现代码
2013/03/12 Javascript
回车直接实现点击某按钮的效果即触发单击事件
2014/02/27 Javascript
高性能JavaScript模板引擎实现原理详解
2015/02/05 Javascript
jQuery Ajax调用WCF服务详细教程
2015/03/31 Javascript
详解webpack 配合babel 将es6转成es5 超简单实例
2017/05/02 Javascript
jqgrid实现简单的单行编辑功能
2017/09/30 Javascript
微信小程序之自定义组件的实现代码(附源码)
2018/08/02 Javascript
react 国际化的实现代码示例
2018/09/14 Javascript
对于防止按钮重复点击的尝试详解
2019/04/22 Javascript
JS实现灯泡开关特效
2020/03/30 Javascript
写一个Vue loading 插件
2020/11/09 Javascript
解决vue elementUI 使用el-select 时 change事件的触发问题
2020/11/17 Vue.js
原生JavaScript实现留言板
2021/01/10 Javascript
Python pickle类库介绍(对象序列化和反序列化)
2014/11/21 Python
pyqt5简介及安装方法介绍
2018/01/31 Python
Python实现的读取电脑硬件信息功能示例
2018/05/30 Python
用Python PIL实现几个简单的图片特效
2019/01/18 Python
Python3.5文件修改操作实例分析
2019/05/01 Python
wxPython+Matplotlib绘制折线图表
2019/11/19 Python
使用Nibabel库对nii格式图像的读写操作
2020/07/01 Python
使用HTML5 Canvas API中的clip()方法裁剪区域图像
2016/03/25 HTML / CSS
军校制空专业毕业生自我鉴定
2013/11/16 职场文书
经济管理专业毕业生自荐信范文
2014/01/02 职场文书
数学检讨书1000字
2014/02/24 职场文书
小学阳光体育活动总结
2014/07/05 职场文书
政治学专业毕业生求职信
2014/08/11 职场文书
2015年员工工作表现评语
2015/03/25 职场文书
通知格式
2015/04/27 职场文书
积极心理学课程心得体会
2016/01/22 职场文书
Win11 Build 25179预览版发布(附更新内容+ISO官方镜像下载)
2022/08/14 数码科技