深入理解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 相关文章推荐
对textarea框的代码调试,而且功能上使用非常方便,酷
Jun 30 Javascript
jQuery 开发者应该注意的9个错误
May 03 Javascript
纯js分页代码(简洁实用)
Nov 05 Javascript
原生javaScript做得动态表格(注释写的很清楚)
Dec 29 Javascript
JS验证邮件地址格式方法小结
Dec 01 Javascript
JavaScript jquery及AJAX小结
Jan 24 Javascript
全面了解addEventListener和on的区别
Jul 14 Javascript
JS实现动态增加和删除li标签行的实例代码
Oct 16 Javascript
详解基于webpack搭建react运行环境
Jun 01 Javascript
微信小程序使用template标签实现五星评分功能
Nov 03 Javascript
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
May 27 jQuery
前端实现滑动按钮AJAX与后端交互的示例代码
Feb 24 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扩展CURL的用法详解
2014/06/20 PHP
PHP截取指定图片大小的方法
2014/12/10 PHP
PHP递归调用数组值并用其执行指定函数的方法
2015/04/01 PHP
PHP批量修改文件名称的方法分析
2017/02/27 PHP
php5.6.x到php7.0.x特性小结
2019/08/17 PHP
laravel 配置路由 api和web定义的路由的区别详解
2019/09/03 PHP
jquery中load方法的用法及注意事项说明
2014/02/22 Javascript
对JavaScript中this指针的新理解分享
2015/01/31 Javascript
jQuery增加自定义函数的方法
2015/07/18 Javascript
获取input标签的所有属性的方法
2016/06/28 Javascript
jQuery EasyUI Panel面板组件使用详解
2017/02/28 Javascript
JavaScript实现动态增删表格的方法
2017/03/09 Javascript
jQuery实现简单的滑动导航代码(移动端)
2017/05/22 jQuery
Vue2.0 从零开始_环境搭建操作步骤
2017/06/14 Javascript
微信小程序滚动Tab实现左右可滑动切换
2017/08/17 Javascript
ionic选择多张图片上传的示例代码
2017/10/10 Javascript
10个在JavaScript开发中常遇到的BUG
2017/12/18 Javascript
vue.js绑定事件监听器示例【基于v-on事件绑定】
2018/07/07 Javascript
详解使用VueJS开发项目中的兼容问题
2018/08/02 Javascript
详解JavaScript原生封装ajax请求和Jquery中的ajax请求
2019/02/14 jQuery
了解JavaScript中let语句
2019/05/30 Javascript
微信小程序如何实现全局重新加载
2019/06/05 Javascript
vue-resource 拦截器interceptors使用详解
2021/01/18 Vue.js
[01:01:01]完美世界DOTA2联赛循环赛 GXR vs FTD BO2第一场 10.29
2020/10/29 DOTA
Django2.1.3 中间件使用详解
2018/11/26 Python
Python进程池Pool应用实例分析
2019/11/27 Python
解决Python spyder显示不全df列和行的问题
2020/04/20 Python
Django在Model保存前记录日志实例
2020/05/14 Python
在Python3.74+PyCharm2020.1 x64中安装使用Kivy的详细教程
2020/08/07 Python
美国值得信赖的婚恋交友网站:eHarmony
2018/10/04 全球购物
关键字final的用法
2013/10/02 面试题
《自然之道》教学反思
2014/02/11 职场文书
逃课检讨书
2015/01/26 职场文书
教导主任个人总结
2015/03/03 职场文书
植物园观后感
2015/06/11 职场文书
观看《筑梦中国》纪录片心得体会
2016/01/18 职场文书