Javascript 使用嵌套数组重复

我从我的

restapi

[
  {
    // restaurant details
    },
    "city": {}, // city details
    "location": {}, // location details
    "menu_categories": [
      {
        // menu_categories details
        "menu_items": [
          {
            // menu_items details
            "menu_modifier_groups": [
                {
                // menu_modifier_groups details
                "menu_modifier_items": []
              }
            ]
          }
        ]
      }
    ]
  }
]

在这个数据中，我获取了一个带有

menu\u类别的餐厅，它有一个子
menu\u项目
，然后有一个子
menu\u修改器组
，然后有一个子
menu\u修改器项目

如您所见，我将数组嵌套在彼此之间。
我想使用
ng repeat
将
菜单项
分组到
菜单类别
下。像下面这样

menu_category 1
    menu_item 1
    menu_item 2
menu_category 2
    menu_item 3
    menu_item 4

另外，如何在阵列的一个上使用
ng repeat
？我已将数据分配给
$scope.restarant

您可以尝试以下方法（您可以使用您设置的任何属性而不是标题）：



{{category.title}}

{{item.title}



您可以使用树状视图显示数据

看看这个：
或此链接（相同）

以以下数据为例：

$scope.treedata = 
[
    { "label" : "User", "id" : "role1", "children" : [
        { "label" : "subUser1", "id" : "role11", "children" : [] },
        { "label" : "subUser2", "id" : "role12", "children" : [
            { "label" : "subUser2-1", "id" : "role121", "children" : [
                { "label" : "subUser2-1-1", "id" : "role1211", "children" : [] },
                { "label" : "subUser2-1-2", "id" : "role1212", "children" : [] }
            ]}
        ]}
    ]},
    { "label" : "Admin", "id" : "role2", "children" : [] },
    { "label" : "Guest", "id" : "role3", "children" : [] }
];   

您可以轻松地将rest api数据适配到此工作plunker-

使用
ng repeat

<ul ng-repeat="(key, value) in restaurant" ng-init="outerIndex = $index">
   menu_category {{$index + 1}}
   <li ng-init="innerIndex = $index" ng-repeat="menu_cat in value.menu_categories">
       menu_item  {{($parent.$index*value.menu_categories.length)+($index+1)}}
   </li>
</ul>

希望这能回答你的问题

<ul ng-repeat="(key, value) in restaurant" ng-init="outerIndex = $index">
   menu_category {{$index + 1}}
   <li ng-init="innerIndex = $index" ng-repeat="menu_cat in value.menu_categories">
       menu_item  {{($parent.$index*value.menu_categories.length)+($index+1)}}
   </li>
</ul>

menu_category 1
- menu_item 1
- menu_item 2

menu_category 2
- menu_item 3
- menu_item 4

menu_category 3
- menu_item 5
- menu_item 6