深入理解angularjs过滤器


Posted in Javascript onMay 25, 2016

•在html文件中和在js文件中使用

$scope.form_time = $filter('date')($scope.time, 'yyyy-MM-dd HH:mm:ss');

<p>{{time | date: 'yyyy-MM-dd HH:mm:ss'}}</p>

•内部过滤器和自定义过滤器

.filter('my_data_format',[function(){
  return function(data,str,sss){
    console.log('data: ',data,' str: ',str,' sss: ',arguments[2]);
  }
}]);
//var1就是第一个参数data, 123是第二个参数str, this是第三个参数
<p>{{var1 | my_data_format : 123 : 'this'}}</p>


//对传入的数据进行处理
.filter('my_data_format',[function(){
  return function(data,str){
    var arr=[];
    angular.forEach(data, function(one_list){
      if(one_list.status == str){
        arr.push(one_list);
      }
    });
    return arr;
  }
}]);
//过滤器可以用在绑定的值中,也可以用在ng-if="(lists | my_data_format: '2').length>0", 和ng-show等;类似的表达式中。作为判断语句
<p ng-repeat = "list in lists">姓名:{{list.name}},人数{{(lists | my_data_format: '2').length}}</p>

以上这篇深入理解angularjs过滤器就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Prototype Object对象 学习
Jul 12 Javascript
键盘 keycode的值 javascript时触发事件时很有用的要素
Nov 02 Javascript
javascript比较两个日期的先后示例代码
Dec 31 Javascript
javascript属性访问表达式用法分析
Apr 25 Javascript
js实现浮动在网页右侧的简洁QQ在线客服代码
Sep 04 Javascript
javascript表单事件处理方法详解
May 15 Javascript
网站申请不到支付宝接口、微信接口,免接口收款实现方式几种解决办法
Dec 14 Javascript
基于node下的http小爬虫的示例代码
Jan 11 Javascript
详解js正则表达式验证时间格式xxxx-xx-xx形式
Feb 09 Javascript
ndm:NPM的桌面GUI应用程序
Oct 15 Javascript
傻瓜式解读koa中间件处理模块koa-compose的使用
Oct 30 Javascript
vue实现在v-html的html字符串中绑定事件
Oct 28 Javascript
jQuery中on绑定事件后引发的事件冒泡问题如何解决
May 25 #Javascript
jQuery each函数源码分析
May 25 #Javascript
jQuery中的each()详细介绍(推荐)
May 25 #Javascript
jQuery中each()、find()和filter()等节点操作方法详解(推荐)
May 25 #Javascript
jquery easyui datagrid实现增加,修改,删除方法总结
May 25 #Javascript
15个值得开发人员关注的jQuery开发技巧和心得总结【经典收藏】
May 25 #Javascript
HTML5+jQuery插件Quicksand实现超酷的星际争霸2兵种分类展示效果(附demo源码下载)
May 25 #Javascript
You might like
php MsSql server时遇到的中文编码问题
2009/06/11 PHP
php printf输出格式使用说明
2010/12/05 PHP
将酷狗krc歌词解析并转换为lrc歌词php源码
2014/06/20 PHP
PHP常用的类封装小结【4个工具类】
2019/06/28 PHP
PJBlog插件 防刷新的在线播放器
2006/10/25 Javascript
JQuery 引发两次$(document.ready)事件
2010/01/15 Javascript
顶部缓冲下拉菜单导航特效的JS代码
2013/08/27 Javascript
js获取网页可见区域、正文以及屏幕分辨率的高度
2014/05/15 Javascript
js判断变量初始化的三种形式及推荐用的形式
2014/07/22 Javascript
node.js中的fs.truncate方法使用说明
2014/12/15 Javascript
js实现背景图片感应鼠标变化的方法
2015/02/28 Javascript
js面向对象的写法
2016/02/19 Javascript
jQuery对象与DOM对象转换方法详解
2016/05/10 Javascript
JavaScript学习笔记整理_关于表达式和语句
2016/09/19 Javascript
JavaScript中关于for循环删除数组元素内容时出现的问题
2016/11/21 Javascript
简单好用的nodejs 爬虫框架分享
2017/03/26 NodeJs
xmlplus组件设计系列之文本框(TextBox)(3)
2017/05/03 Javascript
基于jquery实现五星好评
2017/11/18 jQuery
Javascript中从学习bind到实现bind的过程
2018/01/05 Javascript
微信小程序progress组件使用详解
2018/01/31 Javascript
JavaScript使用面向对象实现的拖拽功能详解
2019/06/12 Javascript
优雅的使用javascript递归画一棵结构树示例代码
2019/09/22 Javascript
JS实现炫酷雪花飘落效果
2020/08/19 Javascript
python保存数据到本地文件的方法
2018/06/23 Python
Flask框架Flask-Principal基本用法实例分析
2018/07/23 Python
Django中的forms组件实例详解
2018/11/08 Python
解决Django加载静态资源失败的问题
2019/07/28 Python
python多线程实现代码(模拟银行服务操作流程)
2020/01/13 Python
tensorflow实现测试时读取任意指定的check point的网络参数
2020/01/21 Python
世界上最大的家庭自动化公司:Smarthome
2017/12/20 全球购物
斯德哥尔摩通票:Stockholm Pass
2018/01/09 全球购物
Linux如何命名文件--使用文件名时应注意
2014/05/29 面试题
销售总监岗位职责
2014/01/04 职场文书
最美乡村医生事迹材料
2014/06/02 职场文书
慰问信模板
2015/02/14 职场文书
幼师个人总结范文
2015/02/28 职场文书