2014-11-05 84 views
1

在下面的代码中,当我使用filter:filterText时,所有3个参数都得到过滤。如果我想要过滤两个参数中的任何一个,我可以在那里使用哪种表达式?如何以角度js一次使用多个过滤器

<div ng-controller="someController"> 
    <input type="text" ng-model="filterText"></input> 
    <ul> 
     <li ng-repeat="friend in friends|filter:filterText"> 
      ({{friend.name}},{{friend.phone}},{{friend.mail}}) 
     </li> 
    </ul> 
</div> 
<script type="text/javascript"> 
    var myapp1=angular.module("myApp",[]); 
    myapp1.controller("someController",function($scope,$filter){ 
     $scope.friends=[ 
      { 
       name:"asdf", 
       phone:"123456", 
       mail:"[email protected]" 
      }, 
      { 
       name:"qwe", 
       phone:"456887", 
       mail:"[email protected]" 
      }, 
      { 
       name:"cvb", 
       phone:"7786887", 
       mail:"[email protected]" 
      } 
     ]; 
    }); 
</script> 

回答

1

通过定义过滤器的对象,您可以定义要过滤的字段。下面的例子只搜索在田里namemail

var myapp1=angular.module("myApp",[]); 
 

 
myapp1.controller("someController",function($scope,$filter){ 
 
    $scope.friends=[{ 
 
    name:"asdf", 
 
    phone:"123456", 
 
    mail:"[email protected]" 
 
    }, 
 
    { 
 
    name:"qwe", 
 
    phone:"456887", 
 
    mail:"[email protected]" 
 
    }, 
 
    { 
 
    name:"cvb", 
 
    phone:"7786887", 
 
    mail:"[email protected]" 
 
    }]; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="someController"> 
 
    Name: <input type="text" ng-model="filterName" /> 
 
    Email: <input type="text" ng-model="filterEmail" /> 
 
    <ul> 
 
     <li ng-repeat="friend in friends|filter:{ name: filterName, mail: filterEmail}"> 
 
     ({{friend.name}},{{friend.phone}},{{friend.mail}}) 
 
     </li> 
 
    </ul> 
 
</div>

+0

该版本具有相同的名称和邮件地址返回元素 – 2014-11-05 07:39:34

+0

这就是真实的,旧的版本,如果定义的字符串检查包含在'name'和'email'中。我已经更新了我的剪辑,因此现在可以提供名称字符串和电子邮件字符串 – boindiil 2014-11-05 07:42:24

0
You can do this : 

<input type="text" ng-model="filterName" placeholder="by name"/> 
<input type="text" ng-model="filterMail" placeholder="by mail"/> 
<ul> 
    <li ng-repeat="friend in friends|filter:filterName|| filterMail"> 
     ({{friend.name}},{{friend.phone}},{{friend.mail}}) 
    </li> 
</ul>