AngularJs学习之一使用自定义的过滤器
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学习之一使用自定义的过滤器的更多相关文章
- AngularJs学习笔记5——自定义服务
前面整理了AngularJs双向数据绑定和自定义指令的相关内容,从手册上看也知道,ng部分还包括过滤器和函数,以及服务等. 过滤器:filter,就是对数据进行格式化,注意管道格式,例如: {{表达式 ...
- AngularJs学习笔记3-服务及过滤器
距离上次别博客有有一段时间了,因为最近公司和个人事情比较多,也因为学习新的知识所以耽搁了,也有人说Angularjs1.5没有人用了,没必要分享,我个人感觉既然开头了我就坚持把他写完,对一些还在使用或 ...
- AngularJs学习笔记3——自定义指令
指令 概述: 前面也说过一些常用指令,用于快速入门.现在详细总结一下:指令用于实现各种页面的操作,是对于底层DOM操作的封装,扩展了HTML的行为,实现页面交互以及数据绑定. 指令是一种执行的信号,一 ...
- vue学习(十六) 自定义私有过滤器 ES6字符串新方法 填充字符串
<div id="app"> <p>{{data | formatStr('yyyy-MM-dd')}}</p></div> //s ...
- AngularJS学习---REST和自定义服务(REST and Custom Services) ngResource step 11
1.切换目录 git checkout step- npm start 2.效果图 效果图和step 10的没有什么差别,这里主要的改动都是代码,代码做了很多优化,这里效果图就不再贴出来了. 3.实现 ...
- AngularJS学习笔记(四) 自定义指令
指令(directive)是啥?简单来说就是实现一定功能的XXX...之前一直用的ng-model,ng-click等等都是指令.当我有一个ng没提供的需求的时候,就可以自定义个指令.指令的好处显而易 ...
- java学习笔记(2):获取文件名和自定义文件过滤器
//自定义文件过滤器import java.io.File; import javax.swing.filechooser.*; public class JavaChooser extends Fi ...
- Spring Cloud Alibaba学习笔记(21) - Spring Cloud Gateway 自定义全局过滤器
在前文中,我们介绍了Spring Cloud Gateway内置了一系列的全局过滤器,本文介绍如何自定义全局过滤器. 自定义全局过滤需要实现GlobalFilter 接口,该接口和 GatewayFi ...
- AngularJs学习笔记--concepts(概念)
原版地址:http://code.angularjs.org/1.0.2/docs/guide/concepts 继续.. 一.总括 本文主要是angular组件(components)的概览,并说明 ...
随机推荐
- net对XML增删改查
Pass:看公司代码,配置下拉框的功能,和下拉框的数字转文字.配置xml里面有下拉的value,name,这样界面直接显示数字,然后转译成中文 1.xml文件格式 <?xml version=& ...
- ajax设置自定义请求头信息
客户端请求 $.ajax({ type:"post", url:urlstr, dataType:'json', async:true, headers:{token:'abck' ...
- http://www.cnblogs.com/figure9/p/developer-reading-list.html
http://www.cnblogs.com/figure9/p/developer-reading-list.html
- smarty foreach循环
1,smarty foreach1,单纯的数组array(1000,2000,3000),使用foreach(from = $array item=foo){$foo}2,键值对数组<ul> ...
- DBA必备:MySQL数据库常用操作和技巧
DBA必备:MySQL数据库常用操作和技巧 2011-02-25 15:31 kaduo it168 字号:T | T MySQL数据库可以说是DBA们最常见和常用的数据库之一,为了方便大家使用,老M ...
- Visual Studio 2013编辑HTML文件无设计视图的解决方案
在Visual Studio 2013中编辑HTML文件,会发现没有设计视图. 解决方法:点击Visual Studio 2013的”工具“菜单,再点击”选项“—>文本编辑器—>文件扩展名 ...
- PHPExcel
1.PHPExcel类中读取Excel文件相关函数和使用方法 插件官网:http://phpexcel.codeplex.com/ <?php require_once 'Classes/PHP ...
- 利用javascript对提交数据验证
优点:提交前验证.在客户端进行. <html> <head> <script language="javascript"> function c ...
- JSP 和 ASP.NET 谁能主宰未来【转】
随着计算机行业的发展,以后到底谁才是 web 网站开发的主宰者呢? 1. 说说JSP.(本人工作中用的最多的就是JSP) JSP. JavaServer Pages 是Java技术的一部分,可以说是J ...
- web文档在线阅览
之前遇到很多各种文档在线阅览的需求,也有不少朋友经常问我这种需求的实现方案,大致试了一下网上的一些比较主流的推荐方案,但都不尽如人意,这里有一个比较全面的总结,需要的朋友可以根据自己的需求到这里查看, ...