JSON到打字稿类，接口？

Question

我正在尝试使用 Angular2 和 Typescript 开发一个 weppapp。我有一个这样的json：

{
"homeMenu":{
    "aname1":{
        "title":"text",
        "route":"myroute"
    },
    "aname2":{
        "title":"text",
        "route":"myroute"
    },
    "aname3":{
        "title":"text",
        "route":"myroute"
    },
    "aname4":{
        "title":"text",
        "route":"myroute",
        "homeMenu":{
            "aname41":{
                "title":"text",
                "route":"myroute"
            },
            "aname42":{
                "title":"text",
                "route":"myroute"
            }
        }
    },
    "aname5":{
        "title":"text",
        "route":"myroute"
    }
}}

我想要一些我不知道的类或接口，生成这种类型的 json。我试过但没有成功，对我来说，我需要 3 个包含所有菜单、一个类菜单和类子菜单的菜单。我有一些类似的东西，但我的 json 上没有例如“aname1”、“aname2”...

一开始我认为它不是一个有效的 JSON，我用一个 json 验证器进行了测试，他是有效的。所以我需要一些帮助来实现这一目标 谢谢:)

Answer 1

根据您的 json 和我的 cmets 的答案，您可以使用接口：

interface HomeMenu {
    [name: string]: MenuItem;
}

interface MenuItem {
    title: string;
    route: string;
    homeMenu?: HomeMenu;
}

interface Menu {
    homeMenu: HomeMenu;
}

let json: Menu = {
    "homeMenu": {
        "aname1": {
            "title": "text",
            "route": "myroute"
        },
        "aname2": {
            "title": "text",
            "route": "myroute"
        },
        "aname3": {
            "title": "text",
            "route": "myroute"
        },
        "aname4": {
            "title": "text",
            "route": "myroute",
            "homeMenu": {
                "aname41": {
                    "title": "text",
                    "route": "myroute"
                },
                "aname42": {
                    "title": "text",
                    "route": "myroute"
                }
            }
        },
        "aname5": {
            "title": "text",
            "route": "myroute"
        }
    }
}

(code in playground)