角度 - 在不使用 ng-repeat的情况下获取数据长度

Angular - get data length without using ng-repeat

本文关键字：获取 情况下 数据 ng-repeat 角度      更新时间：2023-09-26

我正在使用角度，我需要能够显示数组长度，但不要使用ng-repeat。

场景如下：

我有默认.json：

{
 { ...
   "data":
      [{
        "name":"Test",
        "errors":
          [
           {"id": 1,"level": 2,"details": {...}},
           {"id": 3,"level": 1},
           {"id": 5,"level": 1},
           {"id": 5,"level": 1},
           ....
          ],
        },
        {
         "name":"Test",
         "errors":
          [
           {"id": 1,"level": 2,"details": {...}},
           {"id": 5,"level": 1},
           ....
          ],
        }
      ],
    ....
  }
}

然后我从控制器创建了 myData，这样我就可以做类似 ng-repeat="data in myData" 的事情，我可以正确使用它。

现在，问题来了：

我需要回顾所有错误，对象中所有错误的总和。

我尝试做这样的事情：

<span ng-repeat="data in myData">
<i ng-repeat="error in data.errors">{{error.length}}</i>
</span>

什么都没有打印。所以我尝试了：

<span ng-repeat="data in myData">
<i>{{data.errors.length}}</i>
</span>

结果是：

4 2

0 0 0 0 0

这是有道理的，因为我的第一个对象是 4 个错误，我的第二个对象是 2 个错误，依此类推......

但我希望看到的只是：6，因为总共有 6 个错误。

我怎么能只得到一个值，该值汇总了我拥有的所有对象的所有错误，而不必使用ng-repeat（我想我在那里不需要它）

希望这个问题足够清楚，谢谢你的帮助。

一个可能的解决方案是使用 reduce，所以你可以像这样使用 reduce 

var result = array.reduce((prev, curr) => prev + curr);

如果数组[4,2,0] result，它将6

所以一个可能的解决方案是在标记上调用范围内的函数

{{arraySum(data.errors.length)}}

并且该功能将是 

$scope.arraySum= function(array) {
    return array.reduce((prev, curr) => prev + curr);
}

编辑对于此编辑，我们将使用函数映射

标记

{{totalErrors()}}

法典

$scope.totalErrors = function(){
    if ($scope.myData)
        return $scope.myData.data.map(function(o){ return o.errors.length})
                                 .reduce((prev,curr) => {return prev + curr})
}

我已经根据我的理解创建了一个 plunker，即您的数据，您可以在这里看到它工作

这是一个使用 $timeout 模拟 ajax 请求延迟的 plunker。它在标记上使用 ng-cloak 来防止显示原始数据。

你应该在控制器中以这种方式做 

 var sum=0;
 for(var i=0;i<$scope.MyData.length;i++)
 {
   var error=[];
   error=$scope.MyData[i].errors;
   sum=sum+error.length;
 }
 alert(sum+'');
在

控制器中使用此代码（针对承诺进行了更新）

function countErrors(myData) {
  $scope.totalErrors = myData
    .map(function(data) { 
      return data.errors.length; })
    .reduce(function(acc, errorsLenght){
      return acc += errorsLenght }, 0)
}
$scope.myData.$promise.then(countErrors)
相关文章：