AngularJS - 访问另一个 div 中的过滤数据

Question

我有一个过滤器应用于搜索功能，用户在文本框中键入搜索查询，并且 ng-repeat 中的结果被过滤。我的代码是：

<div class="number-results">xxxxxx results found</div>
    <div ng-repeat="product in products | topProductsSearchFilter:searchData" 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>

如你所见，我在 ng-repeat 中调用了过滤器：topProductsSearchFilter:searchData

searchData 是搜索文本框的 ng-model：

<input ng-model="searchData" type="text"/>

我编写的过滤器生成了一个 Products 类型的 JSON 数组。在 html 中，我想在这个 div 中显示过滤器返回的结果数：

<div class="number-results">xxxxxx results found</div>

我的问题是如何最好地访问 ng-repeat div 标签之外的 JSON 数组的长度。

Answer 1

您可以在ng-repeat 表达式中创建过滤列表/别名并获取其长度：

<div ng-repeat="item in filteredItems = (items | someFilter)">
  {{item}}
</div>
<div>number of results: {{filteredItems.length}} out of {{items.length}}</div>