Angular ng-repeat 生成 Foundation 选项卡

Question

我很难将 ng-repeat 与 Foundation (http://foundation.zurb.com/) 选项卡一起使用。

这会显示我希望看到的标签，三个跨，均匀分布。

<dl class="tabs three-up">
  <dd class="active"><a href="#a">A</a></dd>
  <dd class="active"><a href="#a">A</a></dd>
  <dd class="active"><a href="#a">A</a></dd>
</dl>

当我使用 ng-repeat 生成如下选项卡时，选项卡不再并排放置，而是每个选项卡占据了整个宽度，彼此堆叠。

<dl ng-repeat="foo in foos" class="tabs three-up">
  <dd><a href="#/foos/{{foo.id}}">{{foo.name}}</a></dd>
</dl>

在 ng-repeat 中生成选项卡时如何呈现它们？

Answer 1

您需要将 ng-repeat 放在“dd”上

<dl class="tabs three-up">
  <dd ng-repeat="foo in foos"><a href="#/foos/{{foo.id}}">{{foo.name}}</a></dd>
</dl>