将原始 javascript 对象数组转换为结构化对象树，为 ng-repeat 做好准备答案

【问题标题】：Convert raw javascript object array into structured object tree ready for ng-repeat将原始 javascript 对象数组转换为结构化对象树，为 ng-repeat 做好准备
【发布时间】：2014-08-14 04:15:14
【问题描述】：

我正在使用 node.js、mssql（不要问..客户端）、socket.io 和 angularjs 构建一个应用程序。

我已经设法以下列形式从 mssql 获取数据到 angular。

[
    {
        "measure":"value",
        "region":"London",
        "manager":"Jack",
        "supervisor":"James",
        "number1":44,
        "number2":2244.3,
        "number3":1561.6
    },
    {
        "measure":"value",
        "region":"London",
        "manager":"Jack",
        "supervisor":"Jerry",
        "number1":335.4,
        "number2":33.3,
        "number3":11.6
    },
    {
        "measure":"value",
        "region":"London",
        "manager":"John",
        "supervisor":"Joseph",
        "number1":444.3,
        "number2":233,
        "number3":1561.6
    }
]

我正在尝试通过 angular.forEach 来操作数据以达到以下结果：

[
    {
        "region": "London",
        "regionTotals" : {
            "turnover" : {
                "number1" : "TOTAL OF NUMBER 1 WITH REGION LONDON",
                "number2" : "TOTAL OF NUMBER 2 WITH REGION LONDON",
                "number3" : "TOTAL OF NUMBER 3 WITH REGION LONDON"
            }
        },
        "managers" : {
            "jack" : {
                "managerTotals" {
                    "number1": "TOTAL OF NUMBER 1 WITH MANAGER JACK",
                    "number2": "TOTAL OF NUMBER 2 WITH MANAGER JACK",
                    "number3": "TOTAL OF NUMBER 3 WITH MANAGER JACK"
                },
                "supervisors" : {
                    "Jerry": {
                        "supervisorTotals" : {
                            "number1":335.4,
                            "number2":33.3,
                            "number3":11.6
                        }
                    },
                    "James": {
                        "supervisorTotals" : {
                            "number1":44,
                            "number2":2244.3,
                            "number3":1561.6
                        }
                    }
                }
            },
            "john" : {
                "managerTotals" {
                    "number1": "TOTAL OF NUMBER 1 WITH MANAGER JOHN",
                    "number2": "TOTAL OF NUMBER 2 WITH MANAGER JOHN",
                    "number3": "TOTAL OF NUMBER 3 WITH MANAGER JOHN"
                },
                "supervisors" : {
                    "Joseph": {
                        "supervisorTotals" : {
                            "number1":444.3,
                            "number2":233,
                            "number3":1561.6
                        }
                    }
                }
            }
        }
    }
]

这是最好的方法吗？如果您对如何通过 javascript 循环运行它有任何建议，我将不胜感激，因为我正在苦苦挣扎。尤其是尝试设置对象键。

我能想到的唯一其他方法是在节点中运行一堆查询并将它们放在服务器端而不是客户端。但是考虑到我使用的是 mssql，我想将查询保持在最低限度。

谢谢

【问题讨论】：

所以你的问题是关于数据转换的，对吗？我会使用 array.prototype.reduce 之类的东西将我的数组转换为对象，您可以在此处了解更多信息developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
鉴于您没有发布任何代码或任何“最佳”标准（例如快速、易于维护、广泛兼容等），因此无法判断它是否是“最佳方式”。 forEach 可能是一个合理的选择，但可能是也可能不是“最佳”。
感谢您的 cmets。 @DayanMorenoLeon 是的，数据转换是问题的基础，我将研究 reduce 方法。
@RobG 首先易于编程，其次是应用程序速度将是主要标准，因为这是我必须对不同视图进行类似操作的许多数据集之一，我认为专注于一个可能会导致相反的解决方案！
如果您完全了解 reduce、map、filter 的工作原理，那么使用它们会很棒。但是很多人都在挣扎，所以选择变量名的简单循环可能最便于理解和维护。而且它们可能会比嵌套迭代器更快，有时更快，因为它们的函数调用要少得多。

标签： javascript arrays node.js angularjs dynamic-arrays

【解决方案1】：

我不会说这是最好的解决方案，而是可以实现您的目标的解决方案

我通过使用.reduce 和angular.forEach 的某些迭代将JSON 扁平化为相应的结构。 $scope.flattenedRecord 包含转换后的JSON

Working Demo

var app = angular.module('myApp', []);
app.controller('ArrayController', function ($scope) {
    $scope.records = [{
        "measure": "value",
            "region": "London",
            "manager": "Jack",
            "supervisor": "James",
            "number1": 44,
            "number2": 2244.3,
            "number3": 1561.6
    }, {
        "measure": "value",
            "region": "London",
            "manager": "Jack",
            "supervisor": "Jerry",
            "number1": 335.4,
            "number2": 33.3,
            "number3": 11.6
    }, {
        "measure": "value",
            "region": "London",
            "manager": "John",
            "supervisor": "Joseph",
            "number1": 444.3,
            "number2": 233,
            "number3": 1561.6
    }];

    $scope.flattenedRecord = [];

    $scope.managers = [];
    $scope.region = [];

    $scope.records.reduce(function (result, item) {
        $scope.managers.push(item.manager);
        $scope.region.push(item.region);
    }, 0);

    $scope.managers = _.uniq($scope.managers);
    $scope.region = _.uniq($scope.region);

    var mainRecordobj = {};

    angular.forEach($scope.region, function (regionValue) {
        mainRecordobj.region = regionValue;
        var regionTurnoverObj = {};
        var regionNumberObj = {};
        var regionTotalsObj = {};

        var supervisorTotalsObj = {};
        var supervisorNumberObj = {};
        var supervisorNameObj = {};

        var managerTotalsObj = {};
        var managerNameObj = {};
        var managerNumberObj = {};

        regionNumberObj.number1 = "TOTAL OF NUMBER 1 WITH REGION " + regionValue.toUpperCase();
        regionNumberObj.number2 = "TOTAL OF NUMBER 2 WITH REGION " + regionValue.toUpperCase();
        regionNumberObj.number3 = "TOTAL OF NUMBER 3 WITH REGION " + regionValue.toUpperCase();

        angular.forEach($scope.managers, function (managerName) {


            managerNumberObj = {};
            managerNumberObj.number1 = "TOTAL OF NUMBER 1 WITH MANAGER " + managerName.toUpperCase();
            managerNumberObj.number2 = "TOTAL OF NUMBER 2 WITH MANAGER " + managerName.toUpperCase();
            managerNumberObj.number3 = "TOTAL OF NUMBER 3 WITH MANAGER " + managerName.toUpperCase();
            managerTotalsObj = {};

            managerTotalsObj.managerTotals = managerNumberObj;
            supervisorNameObj = {};

            angular.forEach($scope.records, function (recordArray, recordIndex) {

                if (managerName === recordArray.manager) {
                    angular.forEach(recordArray, function (recordValue, recordKey) {

                        if (recordValue === managerName) {
                            supervisorNumberObj = {};
                            supervisorNumberObj.number1 = recordArray.number1;
                            supervisorNumberObj.number2 = recordArray.number2;
                            supervisorNumberObj.number3 = recordArray.number3;
                            supervisorTotalsObj = {};
                            supervisorTotalsObj.supervisorTotals = supervisorNumberObj;
                            supervisorNameObj[recordArray.supervisor] = supervisorTotalsObj;
                        }

                    });
                }
            });

            managerTotalsObj.supervisors = supervisorNameObj;
            managerNameObj[managerName.toLowerCase()] = managerTotalsObj;
        });
        regionTurnoverObj.turnover = regionNumberObj;
        mainRecordobj.regionTotals = regionTurnoverObj;
        mainRecordobj.managers = managerNameObj;
        $scope.flattenedRecord.push(mainRecordobj);
        console.log(angular.toJson($scope.flattenedRecord));
    });
});

输出

[
  {
    "region": "London",
    "regionTotals": {
      "turnover": {
        "number1": "TOTAL OF NUMBER 1 WITH REGION LONDON",
        "number2": "TOTAL OF NUMBER 2 WITH REGION LONDON",
        "number3": "TOTAL OF NUMBER 3 WITH REGION LONDON"
      }
    },
    "managers": {
      "jack": {
        "managerTotals": {
          "number1": "TOTAL OF NUMBER 1 WITH MANAGER JACK",
          "number2": "TOTAL OF NUMBER 2 WITH MANAGER JACK",
          "number3": "TOTAL OF NUMBER 3 WITH MANAGER JACK"
        },
        "supervisors": {
          "James": {
            "supervisorTotals": {
              "number1": 44,
              "number2": 2244.3,
              "number3": 1561.6
            }
          },
          "Jerry": {
            "supervisorTotals": {
              "number1": 335.4,
              "number2": 33.3,
              "number3": 11.6
            }
          }
        }
      },
      "john": {
        "managerTotals": {
          "number1": "TOTAL OF NUMBER 1 WITH MANAGER JOHN",
          "number2": "TOTAL OF NUMBER 2 WITH MANAGER JOHN",
          "number3": "TOTAL OF NUMBER 3 WITH MANAGER JOHN"
        },
        "supervisors": {
          "Joseph": {
            "supervisorTotals": {
              "number1": 444.3,
              "number2": 233,
              "number3": 1561.6
            }
          }
        }
      }
    }
  }
]

【讨论】：

它并没有完全解决我的问题，因为我希望将大写字母中的“TOTAL”值从主管数字中加起来。但是非常感谢您投入时间，它给了我一些好主意！！
嗨，James，您收到我的邮件了吗，我在 6 月 26 日回复您的邮件时已将其丢弃