实现一个按输入框中的数据筛选的功能,筛选可按电影的名称、年份、评分

检索框:
 <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自定义过滤器的更多相关文章

  1. 创建 AngularJS 自定义过滤器,带自定义参数

    Angularjs过滤器是 angularjs非常棒的特性之一.有朝一日,你可能需要使用自定义过滤器,幸运的是,你找到了这篇博文. 下面显示的是自定义过滤器长什么样子(请注意myfilter): &l ...

  2. angularJS自定义过滤器、服务和指令

    自定义过滤器 mainApp.filter('mayfilter',function(){ return function(input){ (过滤逻辑代码) } });   自定义创建指令 mainA ...

  3. angularJS自定义 过滤器基础

    先写个简单的例子,该过滤器是指定规定的字符串长度: html: <div ng-app="app" ng-controller="ctrl"> &l ...

  4. AngularJs自定义过滤器filter

    AngularJs自带有很多过滤器,现在Insus.NET演示一个自定义的过滤器,如实现一个数据的平方. 本演示是在ASP.NET MVC环境中进行. 创建一个app: 创建一个控制器: 接下来是重点 ...

  5. 关于angularjs 中自定义过滤器

    包子认为,在angularjs中,经常需要用到自定义过滤器,来过滤相应的功能,自定义过滤器非常的简单,我就直接贴代码啦 其中input就是你需要进行操作的对象,,,用法就直接就是 是不是很easy.. ...

  6. AngularJs练习Demo8 自定义过滤器

    @{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport&quo ...

  7. AngularJS实现的自定义过滤器简单示例

    本文实例讲述了AngularJS实现的自定义过滤器.分享给大家供大家参考,具体如下: 1.自定义限制字数的过滤器 啥也不说了直接上代码吧 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 ...

  8. AngularJS中自定义过滤器

    AngularJS中为我们提供了一些内置的过滤器,这里列举一些自定义过滤器的场景. 自定义过滤器,不带参赛 //过滤 不带参赛 app.filter('ordinal', function () { ...

  9. angularjs学习第三天笔记(过滤器第二篇---filter过滤器及其自定义过滤器)

    您好,我是一名后端开发工程师,由于工作需要,现在系统的从0开始学习前端js框架之angular,每天把学习的一些心得分享出来,如果有什么说的不对的地方,请多多指正,多多包涵我这个前端菜鸟,欢迎大家的点 ...

随机推荐

  1. django 同步数据库

    http://www.jianshu.com/p/dbc4193b4f95 博主教程讲解比较详细,可做参考使用.

  2. Tomcat发布项目方法

    第一种方法:    将已完成的项目(无论用jbuilder\eclipse\netbeans)下的webroot目录整个拷贝到Tomcat的webapps目录中,假若webroot目录改名为xxx,则 ...

  3. Codefroces 750D:New Year and Fireworks(BFS)

    http://codeforces.com/contest/750/problem/D 题意:烟花会绽放n次,每次会向前推进t[i]格,每次绽放会向左右45°绽放,问有烟花的格子数. 思路:n = 3 ...

  4. HDU 3221 Brute-force Algorithm

              题意:问funny被调用了多少次,结果ModP,P不一定为质数.   首先很容易发现递推公式fn=fn-1*fn-2;写出前几项a,b,a*b,a*b^2,a^2*b^3,a^3* ...

  5. Linux内核分析:dup、dup2的实现

    一.首先需要看一下这两个函数的作用: #include <unistd.h> int dup(int oldfd); int dup2(int oldfd, int newfd); 根据m ...

  6. EF之ExecuteSqlCommand更新出现无效的解决方案

    本篇文章将会剖析为什么会出现这一现象.以及解决的办法 先来看一下代码 public static TResult AddTest() { TestDAL testdal = DALFactory.Cr ...

  7. lua 和 c/c++ 交互 (持续更新)

    参考: http://blog.csdn.net/xiaohuh421/article/details/7476485 http://blog.csdn.net/shun_fzll/article/d ...

  8. 利用JS制作简便计算器

    var d; var a=prompt("请输入数字"); a=parseInt(a); if(isNaN(a)){ alert("請輸入正確數字"); } e ...

  9. CSS下拉列表错误纠正

    上一篇关于CSS制作下来列表的错误纠正. 在上一篇中,用CSS只做了下拉列表,但是鼠标不放在导航栏上的时候,下拉列表也是出来的.具体错误就是 div ul{ list-style:none; max- ...

  10. PHP 编译安装

    1, 获取源码wget -O php.tar.gz http://am1.php.net/get/php-5.6.27.tar.gz/from/this/mirrortar zxvf php.tar. ...