angularjs - 使用angularjs在ng-repeat中显示数组的数量

Question

我有一个包含数据数组的JSON响应。

 $scope.Load = function () {
        $http.post(elasticSearchURL, { "aggs": { "By_type": { "terms": { "field": "Name" }, "aggs": { "By_color": { "terms": { "field": "Color" } } } } } }).
          then(function (response) {
              $scope.modelList = response;


          }, function (response) {
          });

    }

我想显示JSON中每个元素的计数。

MyHtml代码

<div ng-repeat="fruits in modelList.data.hits.hits | unique : '_source.fruitsName' | orderBy:'_source.fruitsName'   ">

{fruits._source.name.length}

</div>

我的Json数据将像这样

{"_id":"e-AB2","_version":1,"found":true, "_source":{"name":"Apple", "color":"red"}}},
{"_id":"e-AB2","_version":1,"found":true, "_source":{"name":"Apple", "color":"red"}}},
{"_id":"e-AB2","_version":1,"found":true, "_source":{"name":"Apple", "color":"red"}}}

它仅显示水果名称“Apple”的长度:5。我想显示_source.name的数组长度

我尝试过 {{$index.length}}，但由于我在 "unique:"中使用 <div>，因此显示为1

如何在angularjs中实现。

提前致谢

Answer 1

我认为最简单的方法是创建包含计数的哈希图:

$scope.counts = {};

$http.post(elasticSearchURL, postData).then(function (response) {
    $scope.modelList = response.data;
    response.data.forEach(function (item) {
        var source = item._source.name;
        if (!$scope.counts.hasOwnProperty(source)) {
            $scope.counts[source] = 0;
        }
        $scope.counts[source]++;
    });
});

然后在 View 中可以使用:

Count = {{counts[fruits._source.name]}}

$scope.counts看起来像:

{ 'Apple':3, 'Orange':5}

您可能想要做的就是以相同的方式将所有数据映射到不同的数组，并摆脱 unique过滤器，因为无法直接在 View 中执行您要查询的操作