angularjs多重过滤前pressions [英] angularjs filtering multiple expressions
问题描述
我是新来angularjs和只是想一些帮助，过滤...
I am new to angularjs and just wanted some help with filtering...
我明白过滤的基础知识（这是很基本的），但使用多前pressions我想要做的是过滤器。
I understand the basics of filtering (which is very basic) but what I want to do is filter using multiple expressions.
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它工作正常，但如果我输入'苹果'我只要我开始输入模型中的过滤器是空白的。
Now if i filter 'apple' or 'iphone5' it works fine but if i type 'apple i' as soon as i start typing the model the filter is blank.
我需要为此创建一个自定义过滤器？
Do I need to create a custom filter for this?
干杯
推荐答案
至少你不能简单地使用过滤器过滤器的基本形式，是因为AngularJS可以' ŧ独自猜测空格的意思是或
At least you can't simply use the basic form of the filter filter, because AngularJS can't guess alone that a space mean "or".
但你并不需要创建自己的指令。 AngularJS 1.1.5提供了第三个参数为过滤（请参阅文档）。它可以采取函数，其中将给出对象值和predicate值进行比较，并如果该项目应包括在过滤结果应返回true。然后，所有你需要做的是：
But you don't need to create your own directive. AngularJS 1.1.5 provides a third parameter for filter (see the documentation). It can take a function, which "will be given the object value and the predicate value to compare and should return true if the item should be included in filtered result". Then, all you have to do is:
$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>
<大骨节病> 小提琴
这篇关于angularjs多重过滤前pressions的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
