Question

我正在尝试使用angularJS制作一个bootstrap单级菜单。当动态构建<li>时，它已经与js和html一起使用。

现在我正在尝试使用AngularJS。

假设我有一个JS对象，它有Cust然后在里面命令。如何制作列表菜单

<ul>
  <li ng-repeat="cust in customers">
    <p>{{cust.name}}</p>
    <li ng-repeat="order in cust.orders">
      <p>{{order.desc}}</p>
    </li>
  </li>
<ul>

由于无法关闭第一个li，因此无法正确加载（重叠项目）。

Answer 1

这是无效的标记，你错过了ul

尝试

<ul>
  <li ng-repeat="cust in customers">
    <p>{{cust.name}}</p>
    <ul>
        <li ng-repeat="order in cust.orders">
          <p>{{order.desc}}</p>
        </li>
    </ul>
  </li>
</ul>

这应该正确呈现，你的绑定是正确的。

Answer 2

克里斯托弗是对的，你离不开<ul>。

我认为你可以这样做以获得一个级别的菜单：

<ul>
    <li ng-repeat="cust in customers">
        <p>{{cust.name}}</p>
        <div ng-repeat="order in cust.orders">
            <p>{{order.desc}}</p>
        </div>
   </li> 
<ul>

也许可以使用CSS来按照自己想要的方式进行风格化。

或者这个：

<ul>
    <li ng-repeat="cust in customers">
        <p>{{cust.name}}</p>
        <p ng-repeat="order in cust.orders">
            {{order.desc}}
        </p>
   </li> 
<ul>

使用嵌套角度ng-repeat的Bootstrap单级菜单

2 个答案: