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

检索框:
 <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. 【笔记】jquery js获取浏览器滑动条距离顶部距离的写法

    jq写法 $(window).scroll(function(){ var $top = $(document).scrollTop(); }); /*注:$(window).scroll(funct ...

  2. js 函数总结

    函数的基本语法如下所示: function functionName(arg0, arg1,...,argN) { statements } 函数如果有返回值则return 后的语句将不会被执行,返回 ...

  3. EditText光标位置

    1.xml中设置 gravity="top"  加入edittext框的高度不止一行时,该属性可是光标定位在第一行,不设置的话光标是默认在框的中间 2.etEdit.setSele ...

  4. android屏幕适配原则

    1.尽量使用线性布局和相对布局 2.尽量使用dip和sp,不要使用px 3.为不同的分辨率提供不同的布局文件和图片 4.在AndroidMainfest.xml中设置多分辨率支持 5.层级嵌套,合理布 ...

  5. dataRow转化为对象

    对象类名useInfo,int,short,string,DateTime格式如下: userInfo.ErrorTimes = int.Parse(dataRow["ErrorTimes& ...

  6. Codeforces Round #389 (Div. 2, Rated, Based on Technocup 2017 - Elimination Round 3) B

    Description Santa Claus decided to disassemble his keyboard to clean it. After he returned all the k ...

  7. 据说年薪30万的Android程序员必须知道的帖子

    Android中国开发精英 目前包括: Android开源项目第一篇--个性化控件(View)篇       包括ListView.ActionBar.Menu.ViewPager.Gallery.G ...

  8. Xcode5中如何切换Storyboards为xib

    在Xcode5中,当创建一个带View的iPhone项目时,默认必须使用Storyboards,不再支持切换xib的checkbox.本文讲解如何手动切换到使用xib来布局. 1,把Main.stor ...

  9. jQuery学习笔记(五)jQuery中的表单

    目录 单行文本框的应用 表单验证 上次我们说完jQuery中的动画之后,我们再来看一种jQuery在Web网页应用最为广泛的一种形式,这就是jQuery对表单的操作,通过jQuery对表单的操作,可以 ...

  10. HTML5 canvas绘图

    HTML5 canvas画图 示例 ------- <!DOCTYPE html> <head> <meta charset="UTF-8"> ...