primeng - 有没有办法将 json 数据自动映射到 PrimeNG 中树表的树节点实例？

Question

我有一些来自服务器的 JSON 数据，我必须将其显示在 UI 上的树表中。我正在使用 PrimeNG Tree Table 组件。我面临的问题是树表需要特定格式的数据。

例如:

这是我从服务器获取的数据:

{
    "records": [
        {
            "name":"Documents",
            "size":"75kb",
            "type":"Folder",
            sub-folder: [
                {
                    "name":"Work",
                    "size":"55kb",
                    "type":"Folder"
                },
                {
                    "name":"Expenses.doc",
                    "size":"30kb",
                    "type":"Document"
                }
            ]
        },
        {
            "name":"Documents",
            "size":"75kb",
            "type":"Folder",
            sub-folder: [
                {
                    "name":"Work",
                    "size":"55kb",
                    "type":"Folder"
                }
            ]
        }
    ]
}

但是，树表需要以下格式的数据:

{
    "data":
    [
        {
            "data":{
                "name":"Documents",
                "size":"75kb",
                "type":"Folder"
            },
            "children":[
                {
                    "data":{
                        "name":"Work",
                        "size":"55kb",
                        "type":"Folder"
                    },
                    "children":[
                        {
                            "data":{
                                "name":"Expenses.doc",
                                "size":"30kb",
                                "type":"Document"
                            }
                        },
                        {
                            "data":{
                                "name":"Resume.doc",
                                "size":"25kb",
                                "type":"Resume"
                            }
                        }
                    ]
                }
            ]
        }
    ]
}

这很难手动完成，因为我正在解析的 JSON 非常复杂。有没有办法将 JSON 数据自动映射到 Tree Table 想要的方式？

这是树节点界面的样子。树节点代表树表的一行。

export interface TreeNode {
    data?: any;
    children?: TreeNode[];
    leaf?: boolean;
    expanded?: boolean;
}

Answer 1

我遇到了同样的问题，不幸的是，您必须编写自己的 JSON 解析器来更改格式，然后才能将其绑定(bind)到树。因为 primeng 树模板与基于该绑定(bind)的特定键和操作绑定(bind)在一起。