Angularjs中对时间格式:/Date(1448864369815)/ 的处理
注:本文使用的 angular 版本为 1.3 版
我们在后台对数据进行json序列化时,如果数据中包含有日期,序列化后返回到前端的结果可能是这样的: /Date(1448864369815)/ 。可是往往我们要在前台显示正常的日期格式,该如何处理呢?在angularjs(后面简称 ng)中处理起来还是挺方便的,首先我们来看下ng中内置的过滤器:date。
ng 过滤器有两种使用方式,分别是: ng表达式 和 控制器中使用代码调用
一. ng表达式
<!-- 表达式中使用 -->
{{ dt1 | date:'yyyy-MM-dd HH:mm:ss' }}
二. 控制器中使用
//必须注入 $filter 模块
app.controller("demoCtrl", ["$scope", "$filter", function($scope, $filter){
$scope.dt1 = new Date(); //控制器中使用
$scope.dt2 = $filter("date")($scope.dt1, "yyyy-MM-dd HH:mm:ss");
}]);
因为 $filter("date")(param, format) 中的 param 是可以接收时间戳的,所以如果我们的日期格式是: /Date(1448864369815)/ 这样的,我们只要获取到里面的时间戳(即: 1448864369815),就可以进行格式转换了,如下所示:
//前台输出 dt3 结果为 2015-11-30 14:19:29
$scope.dt3 = $filter("date")(1448864369815, "yyyy-MM-dd HH:mm:ss");
那么我们如何获取 /Date(1448864369815)/ 里面的时间戳 1448864369815 呢?方法如下:
var _dt = "/Date(1448864369815)/"; //转成数字类型
var timestamp = Number(_dt.replace(/\/Date\((\d+)\)\//, "$1"));
在 ng 中是支持自定义过滤器的(自定义过滤器如果不了解,请自行百度),因此我们可以在原有的 date 过滤器的基础上进行一次包装,编写一个我们自己的过滤器,实现由 /Date(1448864369815)/ 到常规时间格式的转换。代码如下:
//自定义过滤器 jsonDate
app.filter("jsonDate", function($filter) {
return function(input, format) {
//先得到时间戳
var timestamp = Number(input.replace(/\/Date\((\d+)\)\//, "$1")); //转成指定格式
return $filter("date")(timestamp, format);
}
});
实现后,就可以像内置的 date 过滤器一样使用了。
// 控制器中使用
$filter("jsonDate")("/Date(1448864369815)/", "yyyy-MM-dd HH:mm:ss");
<!-- 表达式中使用 -->
{{"/Date(1448864369815)/" | jsonDate:"yyyy-MM-dd HH:mm:ss"}}
Angularjs中对时间格式:/Date(1448864369815)/ 的处理的更多相关文章
- 小程序 js中获取时间new date()的用法(网络复制过来自用)
js中获取时间new date()的用法 获取时间: 1 var myDate = new Date();//获取系统当前时间 获取特定格式的时间: 1 myDate.getYear(); //获 ...
- Js中获取时间 new date()的用法
Js中获取时间 new date()的用法 获取时间: var myDate = new Date();//获取系统当前时间 myDate.getYear(); //获取当前年份(2位) myDate ...
- SQL导入txt以及SQL中的时间格式操作
原文:SQL导入txt以及SQL中的时间格式操作 MySQL中导入txt的指令为: load data local infile "路径名称" into table "表 ...
- java中各种时间格式的转化
http://www.chinaitpower.com/A/2005-01-14/104881.html 使用java.util.Calendar返回间隔天数 static int g ...
- javaScript系列:js中获取时间new Date()详细介绍
var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份(4位,1970-????)m ...
- Newtonsoft.Json中的时间格式详解.
Newtonsoft.json是一款不错的序列化反序列化第三方组件,具体如何使用属于基础知识,此处不再讲解.看以下代码: public class OutgameEntity { public str ...
- PHP中日期时间函数date()用法总结
date()是我们常用的一个日期时间函数,下面我来总结一下关于date()函数的各种形式的用法,有需要学习的朋友可参考. 格式化日期date() 函数的第一个参数规定了如何格式化日期/时间.它使用字母 ...
- 【推荐】PHP中格式化时间函数date与gmdate的区别 | 修改PHP的默认时区
PHP中的时间有2个格式化函数:date()和gmdate(),在官方的文档中的描述为: date -- 格式化一个本地时间/日期 gmdate -- 格式化一个 GMT/UTC 日期/时间,返回的是 ...
- JAVA中Sql时间格式与util时间格式转换
关于时间格式转化: java.util.Date 与 java.sql.Date 互换 sql是子类 字符串转化成java.util.Date SimpleDateFormat date =n ...
随机推荐
- Chart 点击获取坐标
private void chart2_MouseMove(object sender, MouseEventArgs e) { if (!this.DesignMode) { ].AxisX.Sca ...
- 转:C/C++内存管理详解 堆 栈
http://chenqx.github.io/2014/09/25/Cpp-Memory-Management/ 内存管理是C++最令人切齿痛恨的问题,也是C++最有争议的问题,C++高手从中获得了 ...
- 【cs229-Lecture16】马尔可夫决策过程
之前讲了监督学习和无监督学习,今天主要讲“强化学习”. 马尔科夫决策过程:Markov Decision Process(MDP) 价值函数:value function 值迭代:value iter ...
- DateTimePicker 控件的格式设置
DateTimePicker 控件的格式设置 CustomFormat属性设置 : yyyy-MM-dd HH:mm:ss 月大写M,分钟小写m,小时H代表24小时计算,h代表12小时计算yyyy- ...
- overflow:hidden的另一层含义
overflow:hidden这个CSS样式是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出,而对于清除浮动这个含义不是 很了解.一提到清除浮动,我们就会想到另外一个CSS样式 ...
- android自定义之 5.0 风格progressBar
最近做项目,用到了ProgressBar ,就想到了要使用Android5.0 的效果,就随手实现了一下. 效果图: 大概的思路: 1. 圆圈通过Canvas去绘制 2.圆圈的动画通过Animator ...
- Unity 3D Intantiate过程中Transform 空物体和本体之间的关系
想当年刚学Unity的时候,这个问题困扰了我好几天,因此来分享一下当初解决问题的思路. 我们通过Unity构建场景的过程中,经常发现一个现象,就是物体在拖进场景中后,我们会发现物体是反的,通过改变物体 ...
- Fenix – 基于 Node.js 的桌面静态 Web 服务器
Fenix 是一个提供给开发人员使用的简单的桌面静态 Web 服务器,基于 Node.js 开发.您可以同时在上面运行任意数量的项目,特别适合前端开发人员使用. 您可以通过免费的 Node.js 控制 ...
- API Design
REST API Design Guidelines V 1.0.201208 Draft 5 Last Updated: 08/31/2012 1 简介 本文档旨在规范REST API的 ...
- 6/20 sprint3 看板和燃尽图的更新