星空网 > 软件开发 > Java

filter angularjs 过滤器

定义:从一个数组中根据某种规则返回新的数组。

语法:

在html中

{{ filter_expression | filter : expression : comparator}}

 在javascript中:

$filter('filter')(array, expression, comparator)

参数   类型  参数说明

arrry:数组

expression:有三种类型

string:该字符串用于匹配对数组的内容。匹配这个字符串的所有字符串或对象中带字符串属性值的数组将被返回。这也适用于嵌套的对象的属性。规则可以通过前缀字符串取反“!”

 <div ng-init="friends = [{name:'John', phone:'555-1276'},             {name:'Mary', phone:'800-BIG-MARY'},             {name:'Mike', phone:'555-4321'},             {name:'Adam', phone:'555-5678'},             {name:'Julie', phone:'555-8765'},             {name:'Juliette', phone:'555-5678'}]"></div>Search: <input ng-model="searchText"><table id="searchTextResults"> <tr><th>Name</th><th>Phone</th></tr> <tr ng-repeat="friend in friends | filter:searchText">  <td>{{friend.name}}</td>  <td>{{friend.phone}}</td> </tr>  </table>

效果:

 

filter angularjs 过滤器filter angularjs 过滤器

 object:一个对象可用于在数组对象中过滤特定的属性。例如{name:“M”,phone:“1”}规则将返回属性‘name’包含“M”和‘phone’包含“1”的的数组。一个特殊的属性名称$可以使用(如{$:“text”})接受对象的任何属性或它的嵌套对象的属性值中含“text”相匹配。规则可以通过前缀字符串和否定符“!”一起使用,例如{name:“!m”}规则将返回具有不包含“M”属性名的数组。

需要注意的是已命名属性将匹配仅在同一水平的属性,而特殊的$属性将匹配于相同的水平或更深的属性。例如数组项目如{name:{first:'john',last:'lisi'}}将不会被{name:'john'}匹配,但会被{$:'john'}匹配

效果:

<table id="searchObjResults"> <tr><th>Name</th><th>Phone</th></tr> <tr ng-repeat="friendObj in friends | filter:{$:'1'}">  <td>{{friendObj.name}}</td>  <td>{{friendObj.phone}}</td> </tr></table>

filter angularjs 过滤器

<table id="searchObjResults"> <tr><th>Name</th><th>Phone</th></tr> <tr ng-repeat="friendObj in friends | filter:{name:'m'}">  <td>{{friendObj.name}}</td>  <td>{{friendObj.phone}}</td> </tr></table>

filter angularjs 过滤器

<table id="searchObjResults"> <tr><th>Name</th><th>Phone</th></tr> <tr ng-repeat="friendObj in friends | filter:{name:'m',phone:'1'}">  <td>{{friendObj.name}}</td>  <td>{{friendObj.phone}}</td> </tr></table>

filter angularjs 过滤器

function(value, index)::函数可用于写入任意过滤器。该函数调用数组的每个元素。最后的结果是,返回值是”true“的元素的数组




原标题:filter angularjs 过滤器

关键词:JS

JS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

深度干货:找关键词史上最全的方法汇总,卖家必须收藏!:https://www.ikjzd.com/articles/59651
亚马逊日本站爆品清单,卖这些绝对不亏!:https://www.ikjzd.com/articles/59652
这个夏天,销量飙升就选它!:https://www.ikjzd.com/articles/59653
亚马逊卖家的日常运营操作!:https://www.ikjzd.com/articles/59654
Instagram这样玩,超级网红吃透跨境电商:https://www.ikjzd.com/articles/59655
亚马逊测评好做吗?如何甄别市面上的各种测评?:https://www.ikjzd.com/articles/59659
想要搞钱,就去做离搞钱最近的事:https://www.kjdsnews.com/a/1836533.html
ToB销售,解决方案必须让客户听完就想下单:https://www.kjdsnews.com/a/1836534.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流