AngularJS使用筛选器根据属性值查找特定项。

Question

我遇到的情况是:自定义过滤器正在返回一个JSON类型为Product的对象数组。每个产品对象都有4-5个属性，包括标题。

在div元素中，我希望稍后使用标题为"Document“的产品的属性

在这个答案How to filter by object property in angularJS的基础上，我将HTML写成：

<div ng-repeat="product in filteredTopProducts=((products | categoryProductsSearchFilter:searchData:{title:'Document Cloud'}))" class='top-product-icon' ng-click="productClicked(product)">

    <img class='top-product-icon-img' ng-src="{{product.thumbnail}}"/>
    <div class='top-product-icon-title' ng-bind="product.title"></div>
</div>

1)产品是过滤器的输入。

2) categoryProductsSearchFilter是过滤器的名称

3) searchData是一个文本框模型名称(ng- model )，用户可以在其中手动搜索和筛选产品。

问题是上面没有过滤特定的产品，而是显示所有产品，这意味着{title:'Document‘}不起作用。

Answer 1

您需要输入ng模型，这将过滤您的对象标题。比在您-重复只是添加过滤器按查询。

<label for="filter">Filter by title</label>
<input type="text" ng-model="query.title">
<div ng-repeat="product in products | filter:query" ng-click="productClicked(product)">

指定要应用筛选器的属性。

<input type="text" ng-model="queryTitle"> 
<div ng-repeat="product in products | filter:{ title: queryTitle }">