script:

参数item是由AngularJs提供的,是应当被过滤的对象集合。而showComplete是我们传入的参数。

{{item.action}}

用ng-model创造一个名为showComplete的数据

script:

<script type="text/javascript">// <![CDATA[
todoApp.filter("checkedItems",function(){
return function (items,showComplete){
var resultArr =[];
angular.forEach(items,function(item){
if(item.done==false||showComplete==true){
resultArr.push(item);
}
});
return resultArr;
}
});
//</script> <p>参数item是由AngularJs提供的,是应当被过滤的对象集合。而showComplete是我们传入的参数。</p>
<p>{{item.action}}</p>

<tr ng-repeat="item in todo.items|checkedItems:showComplete|orderBy:'action'">
<td>{{item.action}}</td>
</tr>

用ng-model创造一个名为showComplete的数据模型值。
<lable><input type="checkbox" ng-model="showComplete">show complete</input></lable>    show complete

AngularJs学习之一使用自定义的过滤器的更多相关文章

  1. AngularJs学习笔记5——自定义服务

    前面整理了AngularJs双向数据绑定和自定义指令的相关内容,从手册上看也知道,ng部分还包括过滤器和函数,以及服务等. 过滤器:filter,就是对数据进行格式化,注意管道格式,例如: {{表达式 ...

  2. AngularJs学习笔记3-服务及过滤器

    距离上次别博客有有一段时间了,因为最近公司和个人事情比较多,也因为学习新的知识所以耽搁了,也有人说Angularjs1.5没有人用了,没必要分享,我个人感觉既然开头了我就坚持把他写完,对一些还在使用或 ...

  3. AngularJs学习笔记3——自定义指令

    指令 概述: 前面也说过一些常用指令,用于快速入门.现在详细总结一下:指令用于实现各种页面的操作,是对于底层DOM操作的封装,扩展了HTML的行为,实现页面交互以及数据绑定. 指令是一种执行的信号,一 ...

  4. vue学习(十六) 自定义私有过滤器 ES6字符串新方法 填充字符串

    <div id="app"> <p>{{data | formatStr('yyyy-MM-dd')}}</p></div> //s ...

  5. AngularJS学习---REST和自定义服务(REST and Custom Services) ngResource step 11

    1.切换目录 git checkout step- npm start 2.效果图 效果图和step 10的没有什么差别,这里主要的改动都是代码,代码做了很多优化,这里效果图就不再贴出来了. 3.实现 ...

  6. AngularJS学习笔记(四) 自定义指令

    指令(directive)是啥?简单来说就是实现一定功能的XXX...之前一直用的ng-model,ng-click等等都是指令.当我有一个ng没提供的需求的时候,就可以自定义个指令.指令的好处显而易 ...

  7. java学习笔记(2):获取文件名和自定义文件过滤器

    //自定义文件过滤器import java.io.File; import javax.swing.filechooser.*; public class JavaChooser extends Fi ...

  8. Spring Cloud Alibaba学习笔记(21) - Spring Cloud Gateway 自定义全局过滤器

    在前文中,我们介绍了Spring Cloud Gateway内置了一系列的全局过滤器,本文介绍如何自定义全局过滤器. 自定义全局过滤需要实现GlobalFilter 接口,该接口和 GatewayFi ...

  9. AngularJs学习笔记--concepts(概念)

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/concepts 继续.. 一.总括 本文主要是angular组件(components)的概览,并说明 ...

随机推荐

  1. centos7下彻底卸载LibreOffice方法【转载】

    http://linux.it.net.cn/CentOS/course/2014/0720/3211.html你可以尝试 yum erase libreoffice\* 或者 yum remove ...

  2. 后缀自动机&序列自动机综合

    好像序列自动机还没有写过- 串长为n的串共有n+1个节点,除了串中的n个节点,还有一个空的根节点放在串首.每个节点至多有26条出边,每条边连向它之后的第一个字符. 串中的任意一个子序列对应了一条根到某 ...

  3. apache网站访问缓慢的处理记录

    朋友在阿里云上开通了一台ubuntu服务器(2G内存,2核CPU),用apache搭建了一个公众号网站.网站初期,他没有做相应的优化,在后续公众号推广活动时,网站并发突增,访问十分缓慢.登陆服务器,具 ...

  4. Web APP开发技巧总结

    http://www.admin10000.com/document/6304.html 1. 当网站添加到主屏幕后再点击进行启动时,可隐藏地址栏(从浏览器跳转或输入链接进入并没有此效果) <m ...

  5. PAT 1019. 数字黑洞 (20)

    给定任一个各位数字不完全相同的4位正整数,如果我们先把4个数字按非递增排序,再按非递减排序,然后用第1个数字减第2个数字,将得到一个新的数字.一直重复这样做,我们很快会停在有"数字黑洞&qu ...

  6. BZOJ 1026 【SCOI2009】 windy数

    Description windy定义了一种windy数.不含前导零且相邻两个数字之差至少为2的正整数被称为windy数. windy想知道, 在A和B之间,包括A和B,总共有多少个windy数? I ...

  7. ASP.NET MVC读取XML并使用ViewData显示

    看到网上一个网友问及,无法获取XML某一个节点内容.下面Insus.NET在ASP.NET MVC环境下实现它. 先把XML文件放入App_Data目录,当然你可以放在自建目录中.打开看看它有几层,几 ...

  8. checkbox页面全选

    http://pan.baidu.com/s/1tfzSa

  9. C# 如何定义让PropertyGrid控件显示[...]按钮,并且点击后以下拉框形式显示自定义控件编辑属性值

    关于PropertyGrid控件的详细用法请参考文献: 1.C# PropertyGrid控件应用心得 2.C#自定义PropertyGrid属性 首先定义一个要在下拉框显示的控件: using Sy ...

  10. wap端开发必须基础

    1. nitial-scale=1.0 确保网页加载时,以 1:1 的比例呈现,不会有任何的缩放. 在移动设备浏览器上,通过为 viewport meta 标签添加 user-scalable=no  ...