今天给大家分享一个,我在项目中自定义的一个日期过滤器。具体过滤出来的效果可参看下图:

用法:

{{ time | timeFilter }}

filter:

App.filter('timeFilter', function() { // 日期格式化

    //获取相对日期
function GetRelativeDate(timestampstr) {
var timestamp = parseInt(timestampstr);
timestamp = isNaN(timestamp) ? 0 : timestamp;
var thenT = new Date(timestamp);
thenT.setHours(0);
thenT.setMinutes(0);
thenT.setSeconds(0);
var nowtime = new Date();
nowtime.setHours(0);
nowtime.setMinutes(0);
nowtime.setSeconds(0);
var delt = Math.round((nowtime.getTime() - thenT.getTime()) / 1000 / 86400);
var day_def = {
'-3': '大后天',
'-2': '后天',
'-1': '明天',
'0': '今天',
'1': '昨天',
'2': '前天',
'3': '上前天'
}[delt.toString()] || ((delt >= -30 && delt < 0) ? Math.abs(delt) + '天后' : (delt > 0 && delt <= 30) ? delt + '天前' : GetDateString(timestamp));
return day_def;
} function GetDateString(timestampstr, split) {
var timestamp = parseInt(timestampstr);
timestamp = isNaN(timestamp) ? 0 : timestamp;
var datetime = new Date(timestamp);
var month = datetime.getMonth() + 1;
var date = datetime.getDate();
if (split === undefined) split = '-';
return datetime.getFullYear() + split + (month > 9 ? month : "0" + month) + split + (date > 9 ? date : "0" + date);
} return function(time) {
var week = new Date(parseInt(time) * 1000).getDay();
var hours = new Date(parseInt(time) * 1000).getHours();
var minutes = new Date(parseInt(time) * 1000).getMinutes(); if(hours < 10 && minutes < 10) {
var t = '0' + hours + ':0' + minutes;
}else if(hours < 10 && minutes > 9) {
var t = '0' + hours + ':' + minutes;
}else if(hours > 9 && minutes < 10) {
var t = hours + ':0' + minutes;
}else {
var t = hours + ':' + minutes;
} switch(week) {
case 1:
return '周一('+GetRelativeDate(time * 1000)+' '+ t +')';
case 2:
return '周二('+GetRelativeDate(time * 1000)+' '+ t +')';
case 3:
return '周三('+GetRelativeDate(time * 1000)+' '+ t +')';
case 4:
return '周四('+GetRelativeDate(time * 1000)+' '+ t +')';
case 5:
return '周五('+GetRelativeDate(time * 1000)+' '+ t +')';
case 6:
return '周六('+GetRelativeDate(time * 1000)+' '+ t +')';
case 0:
return '周日('+GetRelativeDate(time * 1000)+' '+ t +')';
}
};
});

angularjs自定义日期过滤器,如:周日(前天 21:24)的更多相关文章

  1. angularJS自定义一个过滤器

    ng允许我们自定义指令 下面来我们自己来定义一个过滤指令:filter,返回一个函数的形式 filter(name,callback(){//name:过滤器的名字,callback:匿名函数 ret ...

  2. AngularJs自定义过滤器filter

    AngularJs自带有很多过滤器,现在Insus.NET演示一个自定义的过滤器,如实现一个数据的平方. 本演示是在ASP.NET MVC环境中进行. 创建一个app: 创建一个控制器: 接下来是重点 ...

  3. angularjs自定义过滤器

    实现一个按输入框中的数据筛选的功能,筛选可按电影的名称.年份.评分检索框: <input type="text" placeholder="可检索名字评分和年份&q ...

  4. Spring Cloud Alibaba学习笔记(21) - Spring Cloud Gateway 自定义全局过滤器

    在前文中,我们介绍了Spring Cloud Gateway内置了一系列的全局过滤器,本文介绍如何自定义全局过滤器. 自定义全局过滤需要实现GlobalFilter 接口,该接口和 GatewayFi ...

  5. 前端MVC学习总结(二)——AngularJS验证、过滤器、指令

    一.验证 angularJS中提供了许多的验证指令,可以轻松的实现验证,只需要在表单元素上添加相应的ng属性,常见的如下所示: <input Type="text" ng-m ...

  6. angularjs之filter过滤器

    现在公司用ionic,就是基于angularjs封装了一些api用于webapp,最近用的angularjs的filter确实省了很多代码,现在总结一下! ng比较鸡肋的过滤器,这里就一笔带过吧!鸡汤 ...

  7. 前端MVC学习总结——AngularJS验证、过滤器

    前端MVC学习总结--AngularJS验证.过滤器 目录 一.验证 二.过滤器 2.1.内置过滤器 2.1.1.在模板中使用过滤器 2.1.2.在脚本中调用过滤函数 2.2.自定义过滤器 三.指令( ...

  8. AngularJS中的过滤器

    欢迎大家指导与讨论 : ) 一.前言 AngularJS的过滤器能够将数据在被指令处理到显示在视图之前进行处理和转换.而且,过滤器不会修改作用域中的数据本身,即过滤器会保证数据的完整性.这样子能够允许 ...

  9. AngularJS的date 过滤器

    date 过滤器可以将日期格式化成需要的格式.AngularJS中内置了几种日期格式,如果没有指定使用任何格式,默认会采用 mediumDate 格式,下面的例子中展示了这个格式. ·下面是内置的支持 ...

随机推荐

  1. iOS程序-UIScrollView的基本使用

    iOS程序-UIScrollView的基本使用 scrollView的几个属性contentSize contentOffset contentInset 1.不能向上滑动很可能是因为contentS ...

  2. Node.js stream 流学习

    由于node.js 创建http 是这样的 http.createServer(function(request,response){}).listen(2000); 里面的request 就是rea ...

  3. OpenRisc-47-or1200的WB模块分析

    引言 “善妖善老,善始善终”,说的是无论什么事情要从有头有尾,别三分钟热度. 对于or1200的流水线来说,MA阶段是最后一个阶段,也是整条流水线的收尾阶段,负责战场的清扫工作.比如,把运算指令的运算 ...

  4. Extjs4 中在指定光标处插入值

    var rulearea = Ext.getCmp(文本域Id); var rulevalue = rulearea.getValue();// 获取文本textarea 里面的值 var start ...

  5. 单机使用tungsten 同步mysql数据到mongodb

    [注意],当前的测试环境仅仅是一台服务器. 部署测试的tungten版本是2.1.2-xxxx; Requirements: mysql配置

  6. I - Agri-Net - poj 1258

    貌似就是个裸的最小生成树啊 ******************************************************************************* #inclu ...

  7. win7安装ruby on rails

    开发机:win7 旗舰版 - 64位 1,安装ruby,下载rubyinstaller-2.0.0-p451.exe 下载地址:http://rubyinstaller.org/downloads/ ...

  8. Jquery操作select、checkbox、radio详细讲解

    一 .Select jQuery获取Select选择的Text和Value: 1. $("#select_id").change(function(){//code...}); / ...

  9. wxPython学习笔记(一)

    创建最小的空的wxPython程序 frame = wx.Frame(parent=None, title='Bare') frame.Show() return True app = App() a ...

  10. (2)入门指南——(2)jQuery可以做什么(What jQuery does)

    The jQuery library provides a general-purpose abstraction layer for common web scripting, and is, th ...