javascript - 尝试输出多维数组时，AngularJS 中的 ng-repeat 不起作用

Question

我有一个简单的数组，我想将其输出到我的列表中。当我调用它时，数组的第一维的数组可以工作，但是第二维的数组无法被检测到。我在这里做错了什么或者我错过了什么？下面是我的代码:

Angular.js

angular.module( 'theme' , [
    ] ).controller('sideController' , function($scope){

        $scope.menuName = [
            {'name': 'Header' , 'element' : [
                {'id' : 'template1' , 'template': 'wp-content/themes/dynamictheme/img/template/template1.png'} 
            ]
        }];
    })
;

HTML

<div id="slideout" ng-app="theme"> 
    <div id="slideMenu" ng-controller='sideController'>
        <ul style="list-style-type: none;">

            <!--- Worked --->

            <li class="active" ng-repeat="menus in menuName">
                <h3><a class="menuItem" id="{{menus.name}}">{{menus.name}}</a></h3>
            </li>

            <!--- Didn't Work --->

            <li id="{{subMenu.id}}" class="draggable" ng-repeat="subMenu in menus.element">
                <img src="{{subMenu.template}}" width="200" />
            </li>
        </ul>
    </div>
</div>

Answer 1

子菜单必须位于外部 ng-repeat 内部(为简单起见，用 div 替换):

<div class="active" ng-repeat="menus in menuName">
  <h3><a class="menuItem" id="{{menus.name}}">{{menus.name}}</a></h3>
  <div id="{{subMenu.id}}" class="draggable" ng-repeat="subMenu in menus.element">
    <img src="{{subMenu.template}}" width="200" />
  </div>
</div>

否则，范围内没有menus标识符。