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


Posted in Javascript onFebruary 17, 2017

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

<div ng-app>

  <p>

    <label>Select a date</label>

    <input type="date" id="date" ng-model="datevalue" />

  </p>

  <p> {{ datevalue | date : 'fullDate'}} </p>

</div>

那么问题来了,如果我需要在控制器(controller)的js代码中使用filter来格式化时间/日期,应该怎样处理呢? 直接上代码吧: 视图(view)模板代码:

<div ng-app="dateApp" ng-controller="dateController">

  <p> {{ result }} </p>

</div>

控制器(controller)代码:

var app = angular.module('dateApp', []);

  app.controller(

    'dateController',

    function ($scope, $filter) {

      $scope.result = $filter('date')(new Date(), 'fullDate');

    }

);

以上就是在控制器(controller.js)的js代码中使用过滤器($filter)格式化日期/时间的实现。希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
非常漂亮的JS代码经典广告
Oct 21 Javascript
javascript打印html内容功能的方法示例
Nov 28 Javascript
Bootstrap框架结合jQuery仿百度换肤功能实例解析
Sep 17 Javascript
在JSP中如何实现MD5加密的方法
Nov 02 Javascript
js实现手机拍照上传功能
Jan 17 Javascript
vue学习之mintui picker选择器实现省市二级联动示例
Oct 12 Javascript
Router解决跨模块下的页面跳转示例
Jan 11 Javascript
浅谈Vue内置component组件的应用场景
Mar 27 Javascript
nuxt.js中间件实现拦截权限判断的方法
Nov 21 Javascript
JS实现给数组对象排序的方法分析
Jun 24 Javascript
微信小程序学习总结(四)事件与冒泡实例分析
Jun 04 Javascript
Vue使用axios引起的后台session不同操作
Aug 14 Javascript
bootstrap Validator 模态框、jsp、表单验证 Ajax提交功能
Feb 17 #Javascript
走进AngularJs之过滤器(filter)详解
Feb 17 #Javascript
jQuery实现弹幕效果
Feb 17 #Javascript
Ajax基础知识详解
Feb 17 #Javascript
bootstrap中模态框、模态框的属性实例详解
Feb 17 #Javascript
Extjs gridpanel 中的checkbox(复选框)根据某行的条件不能选中的解决方法
Feb 17 #Javascript
原生js实现日期计算器功能
Feb 17 #Javascript
You might like
php cc攻击代码与防范方法
2012/10/18 PHP
php socket客户端及服务器端应用实例
2014/07/04 PHP
PHP的伪随机数与真随机数详解
2015/05/27 PHP
php显示页码分页类的封装
2017/06/08 PHP
PHP pthreads v3下worker和pool的使用方法示例
2020/02/21 PHP
脚本之家贴图转换+转贴工具用到的js代码超级推荐
2007/04/05 Javascript
jQuery代码优化 事件委托篇
2011/11/01 Javascript
Extjs的FileUploadField文件上传出现了两个上传按钮
2014/04/29 Javascript
js实现时间显示几天前、几小时前或者几分钟前的方法集锦
2015/05/29 Javascript
全面解析标签页的切换方式
2016/08/21 Javascript
JS数组去重(4种方法)
2017/03/27 Javascript
JS 验证密码 不能为空,必须含有数字、字母、特殊字符,长度在8-12位
2017/06/21 Javascript
windows下更新npm和node的方法
2017/11/30 Javascript
红黑树的插入详解及Javascript实现方法示例
2018/03/26 Javascript
JavaScript实现新年倒计时效果
2018/11/17 Javascript
vue 实现v-for循环回来的数据动态绑定id
2019/11/07 Javascript
js实现购物车商品数量加减
2020/09/21 Javascript
解决Vue项目中tff报错的问题
2020/10/21 Javascript
[03:07]2015国际邀请赛选手档案EHOME.rOtK 是什么让他落泪?
2015/07/31 DOTA
python数据结构树和二叉树简介
2014/04/29 Python
Python中创建字典的几种方法总结(推荐)
2017/04/27 Python
对Pandas MultiIndex(多重索引)详解
2018/11/16 Python
Python根据当前日期取去年同星期日期
2019/04/14 Python
Python 点击指定位置验证码破解的实现代码
2019/09/11 Python
python将数据插入数据库的代码分享
2020/08/16 Python
如何在Anaconda中打开python自带idle
2020/09/21 Python
免费获得微软MCSD证书赶快行动吧!
2012/11/13 HTML / CSS
Roxy俄罗斯官方网站:冲浪和滑雪板的一切
2020/06/20 全球购物
中文系师范生自荐信
2013/10/01 职场文书
运动会通讯稿100字
2014/01/31 职场文书
协议书格式
2014/04/23 职场文书
关于环保的标语
2014/06/13 职场文书
2014年房产销售工作总结
2014/12/08 职场文书
签字仪式主持词
2015/07/03 职场文书
大学生团支书竞选稿
2015/11/21 职场文书
docker-compose部署Yapi的方法
2022/04/08 Servers