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)的概览,并说明 ...
随机推荐
- JQuery 获取touchstart,touchmove,touchend 坐标
JQuery写法: $('#id').on('touchstart',function(e) { var _touch = e.originalEvent.targetTouches[0]; var ...
- .Net Core 控制台输出中文乱码
Net Core 控制台输出中文乱码的解决方法: public static void Main(string[] args) { Console.Output ...
- 见鬼了,swiper
1.今天不知怎么swiper的onInit函数不起作用,怎么弄都不行: 把以前能行的案例的包都导进去还是不行,但是onSlideChangeEnd可以触发,晕死了.... 不,它触发了一次onInit ...
- github上写blog
http://www.elbow95.me/blog/My-First-Blog-Essay.html 阮一峰的: http://www.ruanyifeng.com/blog/2012/08/blo ...
- ES6 .Set数据结构去除重复元素
用法一 var set = new Set([1, 2, 3, 4, 2, 8, 4]); //两个2 for (var elem of set) { console.log(elem) // 输出结 ...
- SQL Server 安装 功能详解
安装 SQL Server 功能 在“功能选择”页上,SQL Server 功能分为以下两个主要部分:实例功能和共享功能. “实例功能”表示为每个实例安装一次的组件,这样,您将具有它们的多个副 ...
- 通用权限管理系统数据字典 V3.9 版本,欢迎开发个各种业务系统的朋友们,参考表结构
C#.NET通用权限管理系统组件数据字典 导 航 ◇ (01) BaseItemDetails ◇ (02) BaseItems ◇ (03) BaseLog ◇ (04) BaseMessage ...
- 80端口未占用,apache无法启动解决办法
网上很多关于apache无法启动的原因,新手遇到最多的是80端口被占用. 今天为了解决apache和tomcat端口共存问题,修改了httpd.conf的配置,由于增加位置没有做明显标识,重启apac ...
- 别出心裁的Linux系统调用学习法
别出心裁的Linux系统调用学习法 操作系统与系统调用 操作系统(Operating System,简称OS)是计算机中最重要的系统软件,是这样的一组系统程序的集成:这些系统程序在用户对计算机的使用中 ...
- SELECT (Transact-SQL)
从数据库中检索行,并允许从 SQL Server 中的一个或多个表中选择一个或多个行或列. 虽然 SELECT 语句的完整语法较复杂,但其主要子句可归纳如下: [ WITH <common_t ...