ng-repeat：按单个字段过滤

本文翻译自：ng-repeat :filter by single field

I have an array of products that I'm repeating over using ng-repeat and am using 我有一系列产品，我正在重复使用ng-repeat和我正在使用

<div ng-repeat="product in products | filter:by_colour"> 

to filter these products by colour. 用颜色过滤这些产品。 The filter is working but if the product name / description etc contains the colour then the product remains after the filter is applied. 过滤器正在运行，但如果产品名称/描述等包含颜色，则在应用过滤器后产品仍然存在。

How do I set the filter to only apply to the colour field of my array rather than every field? 如何将过滤器设置为仅应用于数组的颜色字段而不是每个字段？

---

#1楼

参考：https://stackoom.com/question/zolE/ng-repeat-按单个字段过滤

---

#2楼

See the example on the filter page. 请参阅过滤器页面上的示例。 Use an object, and set the color in the color property: 使用对象，并在color属性中设置颜色：

Search by color: <input type="text" ng-model="search.color">
<div ng-repeat="product in products | filter:search"> 

---

#3楼

You can filter by an object with a property matching the objects you have to filter on it: 您可以通过具有与您必须在其上过滤的对象匹配的属性的对象进行过滤：

app.controller('FooCtrl', function($scope) {
   $scope.products = [
       { id: 1, name: 'test', color: 'red' },
       { id: 2, name: 'bob', color: 'blue' }
       /*... etc... */
   ];
});

<div ng-repeat="product in products | filter: { color: 'red' }"> 

This can of course be passed in by variable, as Mark Rajcok suggested. 正如Mark Rajcok所说，这当然可以通过变量传递。

---

#4楼

指定要应用过滤器的属性（即colour ）：

<div ng-repeat="product in products | filter:{ colour: by_colour }">

---

#5楼

Be careful with angular filter. 小心角度滤镜。 If you want select specific value in field, you can't use filter. 如果要在字段中选择特定值，则无法使用过滤器。

Example: 例：

javascript JavaScript的

app.controller('FooCtrl', function($scope) {
   $scope.products = [
       { id: 1, name: 'test', color: 'lightblue' },
       { id: 2, name: 'bob', color: 'blue' }
       /*... etc... */
   ];
});

html HTML

<div ng-repeat="product in products | filter: { color: 'blue' }"> 

This will select both, because use something like substr 这将选择两者，因为使用像substr这样的东西
That means you want select product where "color" contains string "blue" and not where "color" is "blue". 这意味着你想要选择产品，其中“颜色”包含字符串“蓝色”而不是“颜色”是“蓝色”。

---

#6楼

If you want to filter on a grandchild (or deeper) of the given object, you can continue to build out your object hierarchy. 如果要对给定对象的孙（或更深）进行过滤，可以继续构建对象层次结构。 For example, if you want to filter on 'thing.properties.title', you can do the following: 例如，如果要对'thing.properties.title'进行过滤，则可以执行以下操作：

<div ng-repeat="thing in things | filter: { properties: { title: title_filter } }">

You can also filter on multiple properties of an object just by adding them to your filter object: 您还可以通过将对象添加到过滤器对象来过滤对象的多个属性：

<div ng-repeat="thing in things | filter: { properties: { title: title_filter, id: id_filter } }">