最近使用angular日期选取器。只需要把所选的输出迄今input输入框,根据默认的假设,显示是在时间的形式的时间戳。不符合规定。需要格成一个特定的公式格公式。但input上ng-model不能直接对用于filter。因此内容需要一种方法来在这里显示格式化。

网上寻找解决方式就是写个directive,详细实例代码例如以下:

JS

angular.module('dateRange',[]).directive('dateFormat', ['$filter',function($filter) {
var dateFilter = $filter('date');
return {
require: 'ngModel',
link: function(scope, elm, attrs, ctrl) { function formatter(value) {
return dateFilter(value, 'yyyy-MM-dd'); //format
} function parser() {
return ctrl.$modelValue;
} ctrl.$formatters.push(formatter);
ctrl.$parsers.unshift(parser); }
};
}]);

HTML

<input type="text" ng-model="start_date" date-format disabled="disabled">

显示效果如图。详细的格式化改动代码中的format就可以。

版权声明:本文博客原创文章。博客,未经同意,不得转载。

angular input使用输入框filter格式化日期的更多相关文章

  1. Angularjs在控制器(controller.js)的js代码中使用过滤器($filter)格式化日期/时间实例

    Angularjs内置的过滤器(filter)为我们的数据信息格式化提供了比较强大的功能,比如:格式化时间,日期.格式化数字精度.语言本地化.格式化货币等等.但这些过滤器一般都是在VIEW中使用的,比 ...

  2. angular 格式化日期

    参考:http://blog.csdn.net/zk437092645/article/details/37882191 html: <input type="text" d ...

  3. vue 添加过滤器-以格式化日期为例

    vue的filter和angular的pipe管道类似,是过滤器 官网:https://cn.vuejs.org/v2/guide/filters.html 添加格式化日期的全局过滤器 在main.j ...

  4. daterangepicker 双日历/格式化日期/日期限制minDate,maxDate

    var locale = { "format": 'YYYY/MM/DD', "separator": " - ", "apply ...

  5. angular内置过滤器-filter

    这篇文章来讲解一下angular内置的filter过滤器. 没错,这个过滤器的名字,就叫'filter',虽然自定义过滤器也是使用module.filter()...但是不要混淆了,这个filter就 ...

  6. JS 仿支付宝input文本输入框放大组件

    input输入的时候可以在后边显示数字放大镜 <!doctype html> <html lang="en"> <head> <meta ...

  7. angularJS 格式化日期 转载

    angularjs中的filter(过滤器)——格式化日期的date 标签: filterangularjsdate http://blog.csdn.net/smile_panda/article/ ...

  8. fmt标签把时间戳格式化日期

    jsp页面标签格式化日期 <%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="f" %> ...

  9. Java链接MySQL练习题:格式化日期、性别;避免代码注入

    一.查询人员名单,按序号 姓名 性格(男或女) 民族(某族) 生日(年月日)输出 import java.sql.*; import java.text.SimpleDateFormat; publi ...

随机推荐

  1. 使用Django创建简易Blog

    网上看了个例子,但是自己却运行不同,最后终于知道了原因,记录下来.原来没有给settings.py里的INSTALLED_APPS添加blog.就像这样: 这是一个手把手的实例教程,本来学习笔记一样, ...

  2. httl开源JAVA模板引擎,动态HTML页面输出

    HTTL(Hyper-Text Template Language)是一个适用于HTML输出的开源JAVA模板引擎,适用于动态HTML页面输出,可用于替代JSP页面,它的指令类似于Velocity. ...

  3. 中国科学院信息project研究所 第四研究室实习生/应届生招聘

    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvU2hpWmhpeGlu/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA ...

  4. A Game of Thrones(0) - PROLOGUE

    "We should start back", Gared urged as the woods began to grow dark around them. "The ...

  5. HDU 1661 Assigments 贪心法题解

    Problem Description In a factory, there are N workers to finish two types of tasks (A and B). Each t ...

  6. EJB体系结构

    为了适应企业的快速发展.缩短企业信息系统的设计和开发周期.降低构建信息系统的成本,Sun公司制订了Java2 SDK Enterprise Edition(J2EE)规范,定义基于组件的方式设计.开发 ...

  7. POJ1300(欧拉回路)

    Door Man Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 2139   Accepted: 858 Descripti ...

  8. 安装sunvirtualbox

    按照网友提供的方法安装sunvirtualbox,老提示:依赖关系不满足: libpython2.6 (>= 2.6) 后来用终端运行 sudo apt-get install virtualb ...

  9. ubuntu 安装输入法(fcitx)

    目前搜狗输入法是基于fcitx框架下的,所以我们得安装fcitx才行 首要得卸载Ubuntu默认的ibus输入法:sudo apt-get remove ibus 然后添加fcitx的nightlyP ...

  10. 20140719中国互联网公司市值排名TOP20

    近期在找工作.关注了一下中国互联网公司的市值,实际情况跟想象的区别非常大. 比方异军突起的小米.京东.唯品会.聚美优品. 比方乐视网由于政策原因,市值两日缩水10亿$.停牌了. 搜房网市值90天蒸发3 ...