ng-repeat以获取内部列表中具有重复值的表 |组按

Question

我正在尝试创建一个表来显示记录列表。

{  
"results":[  
  {  
     "name":"result1",
     "values":[  
        {  
           "level":"local",
           "value":12,
           "period":"Q2"
        },
        {  
           "level":"global",
           "value":80,
           "period":"Q1"
        },
        {  
           "level":"global",
           "value":50,
           "period":"Q2"
        }
     ]
  },
  {  
     "name":"result2",
     "values":[  
        {  
           "level":"local",
           "value":52,
           "period":"Q1"
        },
        {  
           "level":"local",
           "value":65,
           "period":"Q2"
        },
        {  
           "level":"global",
           "value":50,
           "period":"Q1"
        }
     ]
  }]
}

我希望数据以以下格式显示

Name    Level   Q1  Q2
-----------------------
result1 local       12
result1 global  80  50
result2 local   52  65
result2 global  50  

我正在使用ng-repeat来获取此内容。

<div ng-repeat="item in vm.results">
  {{item.name}}
  <div class="col-sm-1" ng-repeat="value in item.values">
    {{value.value}}
  </div>
</div>

在上述方法中，全局层和本地层在同一行中，只选取其中一个值。GroupBy value.level也无济于事。如何在 ng-repeat中实现内部分组？

Answer 1

我在这里使用了uderscore来实现所需的数组，所以你可以使用以下代码：

var newArr = [];
var obj = {
    'name': '',
    'level': '',
    'Q1': '',
    'Q2': ''
}
for (var i = 0; i < $scope.vm.results.length; i++) {
    var values = _.groupBy($scope.vm.results[i].values, 'level');
    console.log(values);
     _.each(values, function(val){
            var obj = {
            'name': '',
            'level': '',
            'Q1': '',
            'Q2': ''
        }
               obj.name=$scope.vm.results[i].name;
               obj.level=val.level;
               _.each(val , function(val1){
                   if(val1.period=='Q1'){
                       obj.Q1=val1.value;
                   }else if(val1.period=='Q2'){
                       obj.Q2=val1.value;
                   }
               })
         newArr.push(obj);

     });
}

您收到的newArr，只需迭代它并将其用于您的表即可。