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，只需迭代它并将它用于你的表就可以了。

ng-repeat来获取内部列表中重复值的表通过...分组

1 个答案: