filter,orderBy等过滤器
filter用法比较灵活(也增加了较高的复杂度),单独列出。
基本的用法:
<input type="text" class="search" ng-model="keyword" />
ng-repeat="item in items | filter:{name:keyword,done:false}" // 默认是and连接多个属性
ng-repeat="item in items | filter:{$:keyword,done:false}" // 表示只计入未完成的,$表示:or
$scope.doneSelect=function(item){ // 这个item是每一项而不是整个源数据(items)
return item.done && item.estimation>20; // 返回true表示保留(而不是返回一个新数据源)
}
ng-repeat="item in items | filter:doneSelect"
统计技巧:
ng-repeat="item in filteredBacklog={backlog|filter:{$:criteria,done:false}}"
Total:{{filteredBacklog.length}}
书中建议这类代码应该放在控制器中(控制器中可以访问$filter),这样更容易实现单元测试。
-----------------------------------------------------------------------------------
orderBy的用法比较简单
<thead>
<th ng-click="sort('name')">Name</th>
<th ng-click="sort('desc')">Description</th>
</thead>
<tbody>
<!--sortFiled: string 是排序的属性名-->
<!--reverse: boolean true升序,false降序-->
<!--排序放在filter之后,是有原因的。相比过滤,排序要付出更大的代价-->
<tr ng-repeat="item in filteredBacklog = (backlog | filter:criteria | orderBy:sortFiled:reverse)">
<td>{{item.name}}</td>
<td>{{item.desc}}</td>
...
</tr>
</tbody>
$scope.sortField = undefined;
$scope.reverse = false; $scope.sort = function(filedName) {
if ($scope.sortField === filedName) {
$scope.reverse = !$scope.reverse;
} else {
$scope.sortField = filedName;
$scope.reverse = false;
}
}
------------------------------------------------------------
从controller、filter(控制器、服务、其他过滤器)等中访问过滤器
// 第一种写法
angular.module('trimFilter', []) .filter('trim', function($filter) { var limitToFilter = $filter('limitTo'); return function(input, limit) {
if (input.length > limit) {
return limitToFilter(input, limit - 3) + '...';
}
return input;
};
});
// 更好的写法(更易读、代码更少)
.filter('trimII', function(limitToFilter) { return function(input, limit) {
if (input.length > limit) {
return limitToFilter(input, limit - 3) + '...'
}
return input;
};
});
filter,orderBy等过滤器的更多相关文章
- Introducation of Servlet filter(servlet过滤器介绍 )
本文章向大家介绍Servlet Filter,主要包括 Servlet Filter使用实例.应用技巧.基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下. 过滤器是一个可以转换 ...
- Filter登录验证过滤器(全局)
通过Filter来定义一个登录验证过滤器,这是就不需要在每一个JSP页面添加判断用户合法性的代码了. 以下示例中包含了5个文件,一个是登录表单LoginForm.jsp,一个是登录判断页LoginCo ...
- jsp filter登录限制过滤器
http://www.cnblogs.com/hemingwang0902/archive/2012/01/09/2316956.html UserFilter.java package filter ...
- Bloom Filter(布隆过滤器)如何解决缓存穿透
本文摘抄自我的微信公众号"程序员柯南",欢迎关注!原文阅读 缓存穿透是什么? 关于缓存穿透,简单来说就是系统处理了大量不存在的数据查询.正常的使用缓存流程大致是,数据查询先进行缓存 ...
- Filter接口编写过滤器
Filter,过滤器,顾名思义,即是对数据等的过滤,预处理过程.为什么要引入过滤器呢?在平常访问网站的时候,有时候发一些敏感的信息,发出后显示时 就会将敏感信息用*等字符替代,这就是用过滤器对信息 ...
- elasticsearch 深入 —— Post Filter后置过滤器
过滤查询以及聚合 A natural extension to aggregation scoping is filtering. Because the aggregation operates i ...
- Bloom Filter(布隆过滤器)
布隆过滤器用于测试某一元素是否存在于给定的集合中,是一种空间利用率很高的随机数据结构(probabilistic data structure),存在一定的误识别率(false positive),即 ...
- codeforces Gym 100338F Spam Filter 垃圾邮件过滤器(模拟,实现)
阅读题, 概要:给出垃圾邮件和非垃圾邮件的集合,然后按照题目给出的贝叶斯公式计算概率一封邮件是垃圾邮件的概率. 逐个单词判断,将公式化简一下就是在垃圾邮件中出现的次数和在总次数的比值,大于二分之一就算 ...
- AngularJs filter 过滤器
Filter Ng里的过滤器. currency:把一个数字格式化成货币模式(如$1,234.56).当没有提供任何货币符号时,默认使用当前区域的符号. 使用: HTML:{{ currency_ex ...
随机推荐
- python调用系统命令popen、system
python调用Shell脚本,有两种方法:os.system(cmd)或os.popen(cmd),前者返回值是脚本的退出状态码,后者的返回值是脚本执行过程中的输出内容.所以说一般我们认为popen ...
- hdu 4763 kmp ***
找AEAEA形式的字符串最长的A长度,E可以为空 只可意会,不可言传,懂kmp即可 #include <stdio.h> #include <string.h> #includ ...
- 获得H.264视频分辨率的方法
转自:http://www.cnblogs.com/likwo/p/3531241.html 在使用ffmpeg解码播放TS流的时候(例如之前写过的UDP组播流),在连接时往往需要耗费大量时间.经过d ...
- 如何通过阅读C标准来解决C语言语法问题
有时候必须非常专注地阅读ANSI C标准才能找到某个问题的答案.一位销售工程师把下面这段代码作为测试用例发给Sun的编译小组. foo(const char **p) {} int main(int ...
- css把超出的部分显示为省略号的方法兼容火狐
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...
- 【T_SQL】基础 续+
十.模糊查询 1.LIKE --查询时,字段中的内容并不一定与查询内容完全匹配,只要字段中含有这些内容. SELECT StuName AS 姓名 FROM Stuinfo WHERE stuname ...
- 理解flex_对齐
容器属性: 左右对齐方式:justify-content:flex-start/flex-end/center/space-between/space-around; 上下对齐方式:align-ite ...
- SQL数据库的基本语句
1.修改字段类型语句: alter table 表名 alter column 列名 类型 例如: alter table D alter column no char(15): 2.从其他地方插 ...
- 在caffe中添加新的layer
比如现在要添加一个vision layer,名字叫Ly_Layer:(一般命名第一个字母大写,其余小写.) 1.属于哪个类型的layer(共五种:common_layer, data_layer, l ...
- Android学习系列(43)--使用事件总线框架EventBus和Otto
事件总线框架 针对事件提供统一订阅,发布以达到组件间通信的解决方案. 原理 观察者模式. EventBus和Otto 先看EventBus的官方定义: Android optimized event ...