angularjs - 使用语义 ui 和 angularjs 显示带有分隔符的项目列表

Question

我想使用语义 UI 和带有 ng-repeat 的 angularjs 显示一个分割列表，但我无法显示分割线。

<div class="ui divided list" ng-repeat="dataset in datasets.results">
    <div class="item">
        <i class="map marker icon"></i>
        <div class="content">
            <a class="header">{{dataset.name}}</a>
            <div class="description">{{dataset.description}}</div>
        </div>
    </div>
</div>

如果我在没有 angularjs 的情况下做类似的事情，那么该行会显示。

我认为是语义.css 中的以下规则隐藏了该行

.ui.divided.list .item:first-child {
  border-top-width: 0;
}

angularjs 的工作方式是否意味着列表中的每个项目都是“第一个”，是否有解决此问题的方法？

这是一个带有示例的jsfiddle

http://jsfiddle.net/uUjTZ/2/

Answer 1

如果你创造了一个小提琴会更好。

制作分隔线的方法有很多，例如：

<div class="ui divided list" ng-repeat-start="dataset in datasets.results">
    <div class="item">
        <i class="map marker icon"></i>
        <div class="content">
            <a class="header">{{dataset.name}}</a>
            <div class="description">{{dataset.description}}</div>
        </div>
    </div>
</div>
<hr ng-if="!$last" ng-repeat-end />