Java - 在后端存储树结构以在前端查看它答案

【问题标题】：Java - store tree structure in backend to view it in frontendJava - 在后端存储树结构以在前端查看它
【发布时间】：2017-08-10 11:36:47
【问题描述】：

我的MongoDB- database 中有以下文档。此文档代表我的 UI 中的文件夹。子文件夹通过 superFolderId 引用父文件夹。

我将在我的 angularJS UI 中查看这棵树。我现在的问题是如何将此树结构存储在后端的列表中，以便在 AngularJS 前端中显示此结构。

如果有任何关于这个方向的提示，我会很高兴的。

{
"_id" : ObjectId("598c43aa76eba30a8ab373ac"),
"name" : "Folder1",
"created" : ISODate("2017-08-10T11:29:41Z"),
"projectId" : "598c425d76eba30a8ab373a6",
"superFolderId" : "",
}
{
"_id" : ObjectId("598c43b176eba30a8ab373ad"),
"name" : "Folder1_1",
"created" : ISODate("2017-08-10T11:29:49Z"),
"projectId" : "598c425d76eba30a8ab373a6",
"superFolderId" : "598c43aa76eba30a8ab373ac",
}
{
"_id" : ObjectId("598c43f676eba30a8ab373ae"),
"name" : "Folder1_1_1",
"created" : ISODate("2017-08-10T11:30:58Z"),
"projectId" : "598c425d76eba30a8ab373a6",
"superFolderId" : "598c43b176eba30a8ab373ad",
}

【问题讨论】：

标签： angularjs java-8

【解决方案1】：

您不需要在服务器端存储树。足够（关于您的示例）_id 记录是 superFolderId 用于其他记录。

在客户端获得记录列表后，您可以轻松地将其转换为树：

function _makeTree(options) {
    var children, e, id, o, pid, path, path_obj, temp, _i, _len, _ref;
    id = options.id || "id";
    pid = options.parent_id || "parent_id";
    children = options.children || "children";
    path = "path";
    path_obj = "path_obj";

    temp = {};
    o = [];
    _ref = options.q;
    for (_i = 0, _len = _ref.length; _i < _len; _i++) {
        e = _ref[_i];
        e[children] = [];
        e[path_obj] = [];
        temp[e[id]] = e;

        if (temp[e[pid]] != null) {

            e[path] = temp[e[pid]].path + '/' + e.name; // generates read-only String path to node

            e[path_obj] = _.clone(temp[e[pid]].path_obj);

            e[path_obj].push({name: e.name, id: e.id, org_id: e.org_id});

            temp[e[pid]][children].push(e);
        } else {
            e[path] = e.name;
            e[path_obj].push({name: e.name, id: e.id, org_id: e.org_id});
            o.push(e);
        }
    }
    return o;
};

^{**我是从我的项目中取出的，所以你可以删除一些多余的东西}

Demo in fiddle

之后，您可以像我发布的 HERE 那样渲染树，或者只是谷歌它：

【讨论】：