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. ACA烤箱菜单各项温度

    说明书找不到了, 网上找到的各项温度说明, 记一个备用 casserole 218度 cake 171度 backery 177度 frozen food 238度 patato 232度 roast ...

  2. Javascript 代码格式化(JsFormat)

    JsFormat 在GitHub 上的地址: https://github.com/jdc0589/JsFormat 这是一个sublime text 2 的插件. 安装: 先安装 sublime p ...

  3. 4816 江哥的dp题b

    4816 江哥的dp题b  时间限制: 1 s  空间限制: 256000 KB  题目等级 : 黄金 Gold 题解       题目描述 Description 给出两个1-N的随机排列A,B.若 ...

  4. gRpc NET Core

    NET Core下使用gRpc公开服务(SSL/TLS) 一.前言 前一阵子关于.NET的各大公众号都发表了关于gRpc的消息,而随之而来的就是一波关于.NET Core下如何使用的教程,但是在这众多 ...

  5. 1003. Emergency

    As an emergency rescue team leader of a city, you are given a special map of your country. The map s ...

  6. UML类图归纳

    作为一个程序员,掌握UML类图是开发和阅读程序的基础. 转载请注明地址http://www.cnblogs.com/zrtqsk/p/3739288.html,谢谢! 一.基本介绍 UML是一种标准的 ...

  7. Java的性能优化

    http://www.toutiao.com/i6368345864624144897/?tt_from=mobile_qq&utm_campaign=client_share&app ...

  8. HDU2255-奔小康赚大钱-二分图最大权值匹配-KM算法

    二分图最大权值匹配问题.用KM算法. 最小权值的时候把权值设置成相反数 /*-------------------------------------------------------------- ...

  9. sql server利用开窗函数over() 进行分组统计

    这是一道常见的面试题,在实际项目中经常会用到. 需求:求出以产品类别为分组,各个分组里价格最高的产品信息. 实现过程如下: declare @t table( ProductID int, Produ ...

  10. Theano2.1.8-基础知识之装载和保存

    来自:http://deeplearning.net/software/theano/tutorial/loading_and_saving.html loading and saving Pytho ...