深入理解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 相关文章推荐
Javascript valueOf 使用方法
Dec 28 Javascript
jQuery与其它库冲突的解决方法
Jun 25 Javascript
jQuery 隐藏和显示 input 默认值示例
Jun 03 Javascript
js实现ArrayList功能附实例代码
Oct 29 Javascript
AngularJs根据访问的页面动态加载Controller的解决方案
Feb 04 Javascript
jquery获取input type=text中的值的各种方式(总结)
Dec 02 Javascript
jquery动态添加带有样式的HTML标签元素方法
Feb 24 jQuery
javaScript中&quot;==&quot;和&quot;===&quot;的区别详解
Mar 16 Javascript
如何获取TypeScript的声明文件.d.ts
May 01 Javascript
socket io与vue-cli的结合使用的示例代码
Nov 01 Javascript
Vue2 添加数据可视化支持的方法步骤
Jan 02 Javascript
ES6中Symbol、Set和Map用法详解
Aug 20 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
setcookie中Cannot modify header information-headers already sent by错误的解决方法详解
2013/05/08 PHP
PHP垃圾回收机制引用计数器概念分析
2013/06/24 PHP
IIS 7.5 asp Session超时时间设置方法
2017/04/17 PHP
PHP模糊查询技术实例分析【附源码下载】
2019/03/07 PHP
javascript hasFocus使用实例
2010/06/29 Javascript
关于IE浏览器以及Firefox下的javascript冒泡事件的响应层级
2010/10/14 Javascript
jQuery制作效果超棒的手风琴折叠菜单
2015/04/03 Javascript
详解JavaScript函数
2015/12/01 Javascript
详解Document.Cookie
2015/12/25 Javascript
Vue2组件tree实现无限级树形菜单
2017/03/29 Javascript
用图片替换checkbox原始样式并实现同样的功能
2018/11/15 Javascript
vue+php实现的微博留言功能示例
2019/03/16 Javascript
通过实例了解Javascript柯里化流程
2020/03/03 Javascript
Vue使用鼠标在Canvas上绘制矩形
2020/12/24 Vue.js
[01:00:53]OG vs IG 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
Pyhthon中使用compileall模块编译源文件为pyc文件
2015/04/28 Python
Python基于checksum计算文件是否相同的方法
2015/07/09 Python
常见python正则用法的简单实例
2016/06/21 Python
Python 将pdf转成图片的方法
2018/04/23 Python
python调用百度地图WEB服务API获取地点对应坐标值
2019/01/16 Python
Python3.4学习笔记之类型判断,异常处理,终止程序操作小结
2019/03/01 Python
python yield关键词案例测试
2019/10/15 Python
Python内置方法实现字符串的秘钥加解密(推荐)
2019/12/09 Python
Python利用Xpath选择器爬取京东网商品信息
2020/06/01 Python
python3环境搭建过程(利用Anaconda+pycharm)完整版
2020/08/19 Python
美国知名的女性服饰品牌:LOFT(洛芙特)
2016/08/05 全球购物
英国独特礼物想法和个性化礼物网站:notonthehighstreet.com
2018/04/16 全球购物
乐高官方旗舰店:LEGO积木玩具
2019/04/06 全球购物
全球最大的瓷器、水晶和银器零售商:Replacements
2020/06/15 全球购物
医学检验专业自荐信
2014/09/18 职场文书
庆六一开幕词
2015/01/29 职场文书
详解CSS玩转图片Base64编码
2021/05/25 HTML / CSS
MyBatis自定义SQL拦截器示例详解
2021/10/24 Java/Android
Java 实现限流器处理Rest接口请求详解流程
2021/11/02 Java/Android
redis protocol通信协议及使用详解
2022/07/15 Redis
django项目、vue项目部署云服务器的详细过程
2022/07/23 Servers