Group By - Angular JS

Question

我有以下JSON格式，我希望通过按群集和idc分组将“虚拟”和“物理”对象合并为一个

[
{
    "_id": {
        "cluster": 1,
        "idc": "LH8",
        "type": "Virtual"
    },
    "SumCores": 112,
    "SumMemory": 384
},
{
    "_id": {
        "cluster": 1,
        "idc": "LH8",
        "type": "Physical"
    },
    "SumCores": 192,
    "SumMemory": 768
},
{
    "_id": {
        "cluster": 2,
        "idc": "LH8",
        "type": "Virtual"
    },
    "SumCores": 232,
    "SumMemory": 469
},
{
    "_id": {
        "cluster": 2,
        "idc": "LH8",
        "type": "Virtual"
    },
    "SumCores": 256,
    "SumMemory": 1024
}

目前，我使用ng-repeat屏幕显示所有输出：

<div ng-repeat="item in servers | orderBy:['idc','cluster'] "><p>IDC:{{item._id.idc}} - Cluster: {{item._id.cluster}} - Type: {{item._id.type}} - Sum Cores: {{ item.SumCores }} </p></div>

产生类似于：

的东西

IDC: LH8 - Cluster: 1 - Type: Virtual - Sum Cores: 192
IDC: LH8 - Cluster: 1 - Type: Physical -Sum Cores: 112
IDC: LH8 - Cluster: 2 - Type: Virtual - Sum Cores: 256
IDC: LH8 - Cluster: 2 - Type: Physical -Sum Cores: 232

理想情况下，我希望将其分组为一个表格，将其作为理想格式：

+---------+--------------------+--------------------+
| Cluster |         LH5        |         LH8        |
+---------+--------------------+--------------------+
|         | Physical | Virtual | Physical | Virtual |
+---------------------------------------------------+
|       1 |   Value  |  Value  |  Value   |  Value  |
|       2 |   Value  |  Value  |  Value   |  Value  |
|       3 |   Value  |  Value  |  Value   |  Value  |
|       4 |   Value  |  Value  |  Value   |  Value  |
+---------+----------+---------+----------+---------+

显然，我的样本中的数据要多得多，而且值代表SumCores。

如果您认为在那里更好地进行更改，我也可以访问控制器：

Machine.aggregate(  [ { $match : {  $and: [  {"idc": req.query.idc }, {"customer":req.query.customer} ] } } ,{"$group":{_id: {"cluster":"$cluster","idc":"$idc","type":"$type"},"SumCores":{"$sum":"$cores"},"SumMemory": { "$sum":"$memory" }}}, { $sort : { idc : -1, cluster: 1 } } ]).exec(function(err, agg) {

res.json(agg);

});

在这里摆弄：http://jsfiddle.net/8n227L2o/

Answer 1

我已经分叉了您的小提琴，现在我已经使用Underscore.js根据您的示例表对您的数据进行分组和过滤。

http://jsfiddle.net/pdc5rvyo/1/

这是非常基本的，并使用嵌套表。您应该能够通过允许用户更改列表的顺序来自定义它。

代码示例：

    var lhSortedList = _.groupBy(servers, function(item) {
        return item._id.idc;
    });
    $scope.lh8Virtual = _.filter(lhSortedList['LH8'], function(item) {
        return item._id.type === 'Virtual';   
    });

以下概述了如何动态执行您想要的操作：

    var lhList = ['LH5', 'LH8']; // sourced from server ?


    var lhSortedList = _.groupBy(servers, function(item) {
        return item._id.idc;
    });

    $scope.lhData = {};

    lhList.forEach(function(lhName) {
        $scope.lhData[lhName + 'Virtual'] = _.filter(lhSortedList[lhName], function(item) {
            return item._id.type === 'Virtual';   
        });
        $scope.lhData[lhName + 'Physical'] = _.filter(lhSortedList[lhName], function(item) {
            return item._id.type === 'Physical';   
        });
    });