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 ...
随机推荐
- go sample-base64
GoSample-base64 package mainimport ( "encoding/base64" "fmt")func base64Encode(s ...
- win7 快捷键
F F1 显示辅助 F2 重命名选定项目 F3 搜索文件或文件夹 F4 在 Windows 资源管理器中显示地址栏列表 F5 刷新活动窗口 F6 在窗口中或桌面上循环切换屏幕元素 F10 激活活动程序 ...
- HDU 3341 Lost's revenge(AC自动机+DP)
Lost's revenge Time Limit: 15000/5000 MS (Java/Others) Memory Limit: 65535/65535 K (Java/Others)T ...
- Arduino101学习笔记(六)—— 高级IO
1.位移输出函数(8位) 输入value数据后Arduino会自动把数据移动分配到8个并行输出端. 其中dataPin为连接DS的引脚号, clockPin为连接SH_CP的引脚号, bitOrder ...
- Liferay 6.2 改造系列之三:删除Docbar中的添加内容功能
在/portal-master/portal-web/docroot/html/portlet/dockbar/add_panel.jsp文件中 将以下内容: if (hasAddContentAnd ...
- 《DSP using MATLAB》示例Example4.13
代码: b = [1, 0, -1]; a = [1, 0, -0.81]; % [R, p, C] = residuez(b,a); Mp = (abs(p))' Ap = (angle(p))'/ ...
- Swift3.0语言教程使用URL字符串
Swift3.0语言教程使用URL字符串 Swift3.0语言教程使用URL字符串,和路径一样,URL其实也是字符串,我们可以将这些字符串称为URL字符串.本小节将讲解URL字符串的使用. 1.编码 ...
- AFNetworking 之于 https 认证
写在开头: 本来这篇内容准备写在AFNetworking到底做了什么?(三)中的,但是因为我想在三中完结这个系列,碍于篇幅所限.并且这一块内容独立性比较强,所以单独拎出来,写成一篇. 本文从源码的角度 ...
- Sprint回顾_团队听诊器
- HTML元素的属性
HTML元素的属性,每个元素都有多个属性值 <p>段落标记</p> <font size=“”>字体大小标记</font>size取值1-7 <h ...