Angular 指令和列表的 ng-repeat；不继承父类

Question

我正在尝试将标准列表项格式包装在 Angular 指令中，然后在各种列表类型中将其与 ng-repeat 一起使用。问题是，指令似乎失去了父类，所以列表没有呈现它应该的方式。这是一个例子：

<ul class="nav nav-pills nav-stacked affix">
  <div ng-repeat="item in items">
    <my-list-item item="item"></my-list-item>
  </div>
</ul>

渲染完全一样：

<ul class="nav navbar-nav navbar-right">
  <div ng-repeat="item in items">
    <my-list-item item="item"></my-list-item>
  </div>
</ul>

所以，这两个渲染完全一样，不是我想要的方式。如何让我的列表项指令知道其父类？

编辑：

<ul class="nav nav-pills nav-stacked affix">
  <li ng-repeat="item in items">
    <my-list-item item="item"></my-list-item>
  </li>
</ul>

my-list-item 指令看起来像这样：

<a class="myClass" href="{{item.target}}"><span ng-bind-html="item.text"></span></a>

Answer 1

<div> 首先不是<ul> 的有效子代。真正唯一有效的孩子是<li>

引导 css 也不会期望它。使用与引导程序建议的标记相匹配的标记并应用文档中使用的任何适当的类。

至于在<my-list-item> 中呈现的内容，如果它也有问题，您需要显示该 html 的样子

参考W3C <UL> Specs

允许的内容

零个或多个 li 元素