AngularJS中嵌套的ng-repeat undefined错误

时间:2013-10-16 10:57:46

标签: javascript twitter-bootstrap angularjs

使用AngularJS 1.2.0-rc3进行非常简单的嵌套ng-repeat问题。

我的控制器中有一个JSON对象,代表一个菜单结构,如下所示:

$scope.menus = [
  {
    title: "menu1", 
    action: "#", 
    menus: [
      {
        title: "submenu1_1",
        action: "stuff"
      },
      {
        title: "submenu1_2",
        action: "moreStuff"
      }
    ]
  },
  {
    title: "menu2", 
    action: "#", 
    menus: [
      {
        title: "submenu2_1",
        action: "awesomeStuff"
      },
      {
        title: "submenu2_2",
        action: "moreAwesomeStuff"
      }
    ]
  }
]

我的视图使用此信息创建Bootstrap nav菜单结构,如下所示:

<div class="navbar">
  <ul class="nav navbar-nav">
    <li ng-repeat="menu in menus" ng-class="{dropdown: menu.menus}">
      <a href="{{menu.action}}" ng-class="{'dropdown-toggle': menu.menus}" data-toggle="dropdown">{{menu.title}}</a>
      <ul ng-if="menu.menus" class="dropdown-menu">
        <li ng-repeat="submenu in menu.menus">
          <a href="{{submenu.action}}">{{submenu.title}}</a>
        </li>
      </ul>
    </li>
  </ul>
</div>

这应该可以正常工作,它确实...... 50%的时间。有时,几乎是随机的,菜单根本不会显示,我将在控制台中收到此错误:

Error: 'undefined' is not an object (evaluating 'node.childNodes')

我的标记有问题吗?有时会在页面加载时出现错误,并且总是在我单击子菜单时(在我的代码中,操作仅由“#”替换)。

0 个答案:

没有答案