1.  filter可以接收参数,参数用 : 进行分割,如下:

{{ expression | filter:argument1:argument2:... }}

2.   filter参数是 对象 ,匹配属性中含有value的

$scope.childrenArray = [
{name:'kimi',age:3},
{name:'cindy',age:4},
{name:'anglar',age:4},
{name:'shitou',age:6},
{name:'tiantian',age:5}
]; {{ childrenArray | filter : {name : 'i'} }} //参数是对象,匹配name属性中含有i的

示例:angular filter多个字段搜索

<input type="text" ng-model="search ">

<!--<li ng-repeat="user in data.users | filter:{name:search}>  -->
<!--此时只搜索了name字段--> <!--搜索name字段、account字段-->
<li ng-repeat="user in data.users | filter:{name:search}:{account:search}>
<span ng-bind="user.name"></span>
<span ng-bind="user.account"></span>
</li>

3.  没有指定过滤哪个字段的情况下,默认filter会匹配所有字段(name、account)的值,类似 多个字段搜索

ng-repeat="user in data.users | filter:search

4. $ 匹配 对象 所有属性 和  嵌套对象属性

<li ng-repeat="user in data.users | filter:{$:search}> 

5.  bind ng-model to the “value” of selected item  instead of item for ui-select

  <ui-select ng-model="fm.countryCode" id="countryCode">
<ui-select-match placeholder="Select a country...">{{$select.selected.label}}</ui-select-match>
<ui-select-choices repeat="item in countries | filter: $select.search" value="{{$select.selected.value}}">
<div ng-bind-html="item.label | highlight: $select.search"></div>
<small ng-bind-html="item.value | highlight: $select.search"></small>
</ui-select-choices>
</ui-select>

Currently it's just setting fm.countryCode to the whole country item.

For example if I select Afghanistan, fm.countryCode will be set to {"value":"AF","label":"Afghanistan"}.

What I want is "AF".

so change  the repeat part

<ui-select-choices repeat="item in countries | filter: $select.search" value="{{$select.selected.value}}">

to

<ui-select-choices repeat="item.value as item in countries | filter: $select.search" value="{{$select.selected.value}}">

 示例:

                                            <ui-select ng-model="networkDefaultValue.resourceId" name="networkname" theme="bootstrap" ng-change="setInputDefaultValue(['resource_id'],networkDefaultValue.resourceId,networkDefaultValue.isResourceIdInput)">
<ui-select-match allow-clear="true" placeholder="{{'Select an option'|translate}}">{{$select.selected.name + ' - ' + $select.selected.properties.datacentername}}</ui-select-match>
<ui-select-choices repeat="resource.id as resource in totalNetworks | filter: { $ : $select.search}">
<div ng-bind-html="resource.name + ' - ' + resource.properties.datacentername | highlight: $select.search"></div>
</ui-select-choices>
</ui-select>

参考网址:

走进AngularJs(七) 过滤器(filter)

AngularJS filter:search 是如何匹配的 ng-repeat filter:search

AngularJS filter:search 是如何匹配的 ng-repeat filter:search ,filter:{$:search},只取repeat的item的value 不含label的更多相关文章

  1. Python: re.compile最短匹配模式,只取双引号内的值\“

    用正则表达式匹配某个文本模式 1.只取双引号内的值 2.长短匹配模式对比 贪婪模式:     模式r'\"(.*)\" '的意图是匹配被双引号包含的文本,但是这个表达式中*是贪婪的 ...

  2. Web.xml中设置Servlet和Filter时的url-pattern匹配规则

    一.servlet容器对url的匹配过程: 当一个请求发送到servlet容器的时候,容器先会将请求的url减去当前应用上下文的路径作为servlet的映射url,比如我访问的是http://loca ...

  3. 四十七.iptables防火墙 filter表控制 扩展匹配 nat表典型应用

    1.iptables基本管理 关闭firewalld,开启iptables服务 查看防火墙规则 追加.插入防火墙规则 删除.清空防火墙规则   1.1 关闭firewalld,启动iptables服务 ...

  4. Python:正则表达式(二):如何使用re.search()返回的匹配对象中的具体内容呢??

    在上一篇中讲述了re.seach()会返回一个对象格式的数据,如下:<_sre.SRE_Match object; span=(16, 24), match='${phone}'> 那么问 ...

  5. AngularJS中angular.min.js:80 Error: [ng:areq] http://errors.angularjs.org/1.2.9/ng/areq

    报出来的时候,出现这种错误,是因为在引入控制器的时候没有引入成功,我遇到这个错误是在因为没有将父控制器引入到子控制器中.

  6. C#中正则表达式只取前N个匹配结果

    用Regex.Matches方法可以得到同指定正则表达式对应的所有匹配结果.有时,所有匹配结果可能有成千上万个,考虑到性能效率的因素,只需要取出前N个匹配结果.下面的代码演示了做法: 需求:取字符串中 ...

  7. filter 死循环(tomcat 启动完成 ,自动执行filter.dofilter,导致tomcat 启动超时) , tomcat 启动和 servers 启动 不同

    package com.diancai.interceptor; import java.io.IOException; import javax.servlet.Filter; import jav ...

  8. dubbo白名单通过filter,spring web通过拦截器或者filter即可

    在开发中,有时候需要限制访问的权限,白名单就是一种方法.对于Java Web应用,Spring的拦截器可以拦截Web接口的调用:而对于dubbo接口,Spring的拦截器就不管用了. dubbo提供了 ...

  9. 'org.springframework.web.filter.CharacterEncodingFilter' is not assignable to 'javax.servlet.Filter,This inspection lets you spot the following problems that might occur in descriptors that are used t

    1.jar包导入错误,因为maven下载的原因: 删除这样的包,然后让maven重新下载,问题就会解决

随机推荐

  1. VB.NET &amp; 策略模式(下机用户类型选择)

    上篇文章讲述了对于下机操作和基本数据设定的时间联系,今天主要就是应用"策略模式"来了解了解对于固定用户,以及暂时用户之间的选择,看学习设计模式的时候自己对于策略模式的理解,我们能够 ...

  2. Spring Boot 属性配置&自定义属性配置

    在使用spring boot过程中,可以发现项目中只需要极少的配置就能完成相应的功能,这归功于spring boot中的模块化配置,在pom.xml中依赖的每个Starter都有默认配置,而这些默认配 ...

  3. 关于Web应用程序,下列说法错误的是( )。

    关于Web应用程序,下列说法错误的是( ). A.WEB-INF目录存在于web应用的根目录下 B. WEB-INF目录与classes 目录平行 C. web.xml在WEB-INF目录下 D. W ...

  4. Angular入门篇高速开发导航网

    简单介绍 AngularJS 是一个为动态WEB应用设计的结构框架,提供给大家一种新的开发应用方式.这样的方式能够让你扩展HTML的语法.以弥补在构建动态WEB应用时静态文本的不足.从而在web应用程 ...

  5. Kivy: 用于NUI开发的跨平台Python框架

    http://top.jobbole.com/9915/ http://kivy.org/

  6. bootstrap基础学习八篇

    bootstrap辅助类 a.对于文本颜色 以下不同的类展示了不同的文本颜色.如果文本是个链接鼠标移动到文本上会变暗: 类 描述 .text-muted "text-muted" ...

  7. superresolution_v_2.0 Application超分辨率程序文档

    SUPERRESOLUTION GRAPHICAL USER INTERFACE DOCUMENTATION Contents 1.- How to use this application. 2.- ...

  8. 【转】Native Thread for Win32 C- Creating Processes(通俗易懂,非常好)

    http://www.bogotobogo.com/cplusplus/multithreading_win32C.php To create a new process, we need to ca ...

  9. Docker容器技术(目录)

    Docker介绍和部署请自行搜索官方网站 [01]Docker学习:镜像管理 [02]Docker学习:容器管理 [03]Docker学习:网络管理 [04]Docker学习:Dockerfile [ ...

  10. java基础---->数组的基础使用(一)

    数组是一种效率最高的存储和随机访问对象引用序列的方式,我们今天来对数组做简单的介绍.手写瑶笺被雨淋,模糊点画费探寻,纵然灭却书中字,难灭情人一片心. 数组的简单使用 一.数组的赋值 String[] ...