angularjs自定义过滤器
实现一个按输入框中的数据筛选的功能,筛选可按电影的名称、年份、评分 检索框:
<input type="text" placeholder="可检索名字评分和年份" class="filter" ng-model="data">
ng-repeat的li:
<ul>
<li class="moveli" ng-repeat="move in moves|check:data"> //check为过滤器名称,data为绑定的输入框数据
.....
<li>
<ul>
自定义的过滤器:
app.filter("check",function(){
return function(input,mydata){ //接受的两个参数分别为 input(要过滤的数据),data(输入框输入的数据)
var show = [];
if(input){
for(var i=0;i<input.length;i++){
if(input[i].title==mydata){
show.push(input[i]);
}else if(input[i].year==mydata){
show.push(input[i]);
}else if(input[i].rating.average==mydata){
show.push(input[i]);
}else if(mydata==''){
show.push(input[i]);
}
}
return show; //返回一个数组
}
}
});
angularjs自定义过滤器的更多相关文章
- 创建 AngularJS 自定义过滤器,带自定义参数
Angularjs过滤器是 angularjs非常棒的特性之一.有朝一日,你可能需要使用自定义过滤器,幸运的是,你找到了这篇博文. 下面显示的是自定义过滤器长什么样子(请注意myfilter): &l ...
- angularJS自定义过滤器、服务和指令
自定义过滤器 mainApp.filter('mayfilter',function(){ return function(input){ (过滤逻辑代码) } }); 自定义创建指令 mainA ...
- angularJS自定义 过滤器基础
先写个简单的例子,该过滤器是指定规定的字符串长度: html: <div ng-app="app" ng-controller="ctrl"> &l ...
- AngularJs自定义过滤器filter
AngularJs自带有很多过滤器,现在Insus.NET演示一个自定义的过滤器,如实现一个数据的平方. 本演示是在ASP.NET MVC环境中进行. 创建一个app: 创建一个控制器: 接下来是重点 ...
- 关于angularjs 中自定义过滤器
包子认为,在angularjs中,经常需要用到自定义过滤器,来过滤相应的功能,自定义过滤器非常的简单,我就直接贴代码啦 其中input就是你需要进行操作的对象,,,用法就直接就是 是不是很easy.. ...
- AngularJs练习Demo8 自定义过滤器
@{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport&quo ...
- AngularJS实现的自定义过滤器简单示例
本文实例讲述了AngularJS实现的自定义过滤器.分享给大家供大家参考,具体如下: 1.自定义限制字数的过滤器 啥也不说了直接上代码吧 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 ...
- AngularJS中自定义过滤器
AngularJS中为我们提供了一些内置的过滤器,这里列举一些自定义过滤器的场景. 自定义过滤器,不带参赛 //过滤 不带参赛 app.filter('ordinal', function () { ...
- angularjs学习第三天笔记(过滤器第二篇---filter过滤器及其自定义过滤器)
您好,我是一名后端开发工程师,由于工作需要,现在系统的从0开始学习前端js框架之angular,每天把学习的一些心得分享出来,如果有什么说的不对的地方,请多多指正,多多包涵我这个前端菜鸟,欢迎大家的点 ...
随机推荐
- 运行第一个abp项目VS2015+localDB
ASP.NET Boilerplate,简称ABP 详细深入:可以参考如下文章 http://www.cnblogs.com/mienreal/p/4528470.html http://www.cn ...
- 下拉菜单demo---参考阿里云首页顶部下拉菜单
前言: 最近开始学习html+css,准备仿照各大网站写一些demo. 正文: 分析阶段: 如下图: 链接来自于: 阿里云:https://www.aliyun.com/ 实现过程: (一)用css3 ...
- 如何在LIRE搜索中使用多特征
这是官网上的解答,先mark下来. http://www.semanticmetadata.net/wiki/lirefaq/ ==================================== ...
- nes 红白机模拟器 第3篇 游戏手柄测试 51 STM32
手柄使用的是 CD4021 ,datasheet 上说支持 3V - 15V . 因为手柄是 5V 供电,2440 开发板上是GPIO 3.3V 电平,STM32 GPIO 也是 3.3V (也兼容5 ...
- 提供在线制作icon的网站
http://www.ico.la/ http://www.makeico.com/ http://free.logomaker.cn/tools/icoMaker.aspx http://ico.5 ...
- 扩展GridView实现的一个自定义无刷新分页,排序,支持多种数据源的控件TwfGridView
最近项目View层越来越趋向于无刷新化,特别是数据展示方面,还要对Linq有很好的支持.在WebFrom模式的开发中,GridView是一个功能很强大,很常用的控件,但是他也不是完美的,没有自带的无刷 ...
- 模块(configparser+shutil+logging)
一.configparser模块 1.模块介绍 configparser用于处理特定格式的文件,其本质上是利用open来操作文件. *注:(这里解释一下特定格式的文件) a.有section和opti ...
- 关于Android中ArrayMap/SparseArray比HashMap性能好的深入研究
由于网上有朋友对于这个问题已经有了很详细的研究,所以我就不班门弄斧了: 转载于:http://android-performance.com/android/2014/02/10/android-sp ...
- ML-线性回归
记样本数目为$m$,样本点$i$用$(x^{(i)}, y^{(i)})$表示,其中 $x^{(i)}=\begin{pmatrix}x_1^{(i)}\\ x_2^{(i)}\\ ...\\x_n^ ...
- JAVA应用程序占用CPU、内存过高分析过程
1.查看cpu占有率 top -P 2.查看进程cpu占用率 ps -mp 3749 -o THREAD,tid,time|sort -rn|head -n 20 查看占用cpu高,且占用时间长的线程 ...