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 相关文章推荐
动态加载iframe
Jun 16 Javascript
js不是基础的基础
Dec 24 Javascript
javascript搜索框点击文字消失失焦时文本出现
Sep 18 Javascript
谈谈对offsetleft兼容性的理解
Nov 11 Javascript
js删除局部变量的实现方法
Jun 25 Javascript
浅述Javascript的外部对象
Dec 07 Javascript
jquery判断页面网址是否有效的两种方法
Dec 11 Javascript
html5+CSS 实现禁止IOS长按复制粘贴功能
Dec 28 Javascript
Angular通过angular-cli来搭建web前端项目的方法
Jul 27 Javascript
使用Node.js实现一个多人游戏服务器引擎
Mar 13 Javascript
Vue实现数据表格合并列rowspan效果
Nov 30 Javascript
Vue中nprogress页面加载进度条的方法实现
Nov 13 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
php递归调用删除数组空值元素的方法
2015/04/28 PHP
PHP的文件操作与算法实现的面试题示例
2015/08/10 PHP
Symfony生成二维码的方法
2016/02/04 PHP
ThinkPHP的常用配置选项汇总
2016/03/24 PHP
学习thinkphp5.0验证类使用方法
2017/11/16 PHP
Javascript String.replace的妙用
2009/09/08 Javascript
js 浏览器事件介绍
2012/03/30 Javascript
JS实现三级折叠菜单特效,其它级可自动收缩
2015/08/06 Javascript
基于AngularJs + Bootstrap + AngularStrap相结合实现省市区联动代码
2016/05/30 Javascript
原生js实现弹出层效果
2017/01/20 Javascript
vue-resource拦截器设置头信息的实例
2017/10/27 Javascript
CentOS7中源码编译安装NodeJS的完整步骤
2018/10/13 NodeJs
微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能
2019/01/22 Javascript
浅谈webpack 四个核心概念之Entry
2019/06/12 Javascript
微信小程序 腾讯地图显示偏差问题解决
2019/07/27 Javascript
从零学Python之入门(四)运算
2014/05/27 Python
教你如何将 Sublime 3 打造成 Python/Django IDE开发利器
2014/07/04 Python
python算法表示概念扫盲教程
2017/04/13 Python
Python实现简单网页图片抓取完整代码实例
2017/12/15 Python
Python操作mongodb数据库进行模糊查询操作示例
2018/06/09 Python
Python3.6.2调用ffmpeg的方法
2019/01/10 Python
用Python中的turtle模块画图两只小羊方法
2019/04/09 Python
python模块导入的方法
2019/10/24 Python
Python字符编码转码之GBK,UTF8互转
2020/02/09 Python
Keras设定GPU使用内存大小方式(Tensorflow backend)
2020/05/22 Python
python tqdm实现进度条的示例代码
2020/11/10 Python
Django+Django-Celery+Celery的整合实战
2021/01/20 Python
J.Crew官网:美国知名休闲服装品牌
2017/05/19 全球购物
会计实习期自我鉴定
2013/10/06 职场文书
2014年毕业演讲稿范文
2014/05/13 职场文书
法院授权委托书范文
2014/08/02 职场文书
学雷锋标兵事迹材料
2014/08/18 职场文书
2014年部门工作总结
2014/11/12 职场文书
观看《信仰》心得体会
2016/01/15 职场文书
再谈python_tkinter弹出对话框创建
2022/03/20 Python
Python 装饰器(decorator)常用的创建方式及解析
2022/04/24 Python