angularjs过滤多个表达式

我是新来angularjs，只是想一些帮助，过滤...angularjs过滤多个表达式

我明白过滤的基础知识（这是很基本的），但我想要做的是过滤器使用的多个表达式。

HTML：

<body data-ng-init="phones = [{make:'Apple', model:'iPhone5'}, {make:'HTC', model:'One'}, {make:'Samsung', model:'GalaxyS4'}]"> 
    <p>my first angular app</p> 
    <p><label>filter</label><input data-ng-model="phoneFilter.$" type="text"></p> 
    <ul> 
     <li data-ng-repeat="phone in phones | filter:phoneFilter"> 
      {{phone.make}} {{phone.model}} 
     </li> 
    </ul> 
</body>

现在，如果我过滤“苹果” 或“的iphone5”它工作正常，但如果我输入“苹果我”我只要一开始输入模型中的过滤器是空白。

我需要为此创建一个自定义过滤器吗？

干杯

来源

2013-08-01 Adi

至少你不能简单地使用过滤器filter的基本形式，因为AngularJS不能单独猜测空格的意思是“或”。

但是你不需要创建你自己的指令。 AngularJS 1.1.5为filter提供了第三个参数（请参阅documentation）。它可以采用一个函数，该函数“将给出对象值和谓词值进行比较，并且如果该项目应该包含在过滤结果中，则返回true”。然后，所有你需要做的是：

$scope.multipleChoicesComparator = function (expected, actualInCompactForm) 
{ 
    // Get a list of predicates 
    var listActual = actualInCompactForm.split(' '); 
    var mustBeIncluded = false; 

    angular.forEach(listActual, function (actual) 
    { 
     // Search for a substring in the object value which match 
     // one of the predicate, in a case-insensitive manner 
     if (angular.lowercase(expected).indexOf(angular.lowercase(actual)) !== -1) 
     { 
      mustBeIncluded = true; 
     } 
    }); 

    return mustBeIncluded; 
};

<li data-ng-repeat="phone in phones | filter:phoneFilter:multipleChoicesComparator"> 
    {{phone.make}} {{phone.model}} 
</li>

Fiddle

来源

2013-08-01 13:06:42 Blackhole

感谢，但只要我输入“我”在iphone（打字苹果之后）从过滤的结果消失仍。 – Adi

它不，只是尝试小提琴。但是'filter'过滤器的第三个参数是在AngularJS 1.1.3中引入的，所以一定要使用至少这个版本。 – Blackhole

angularjs过滤多个表达式

回答

相关问题