使用AngularJS ng-repeat和ui-sortable在jquery sortable之间插入<hr />

Question

我试图在<li>内使用AngularJS ui-sortable对ng-repeat项进行排序。 所以代码看起来像这样：

<ul ui-sortable="sortableOption" ng-model="list">
    <li ng-repeat="item in list"> !@#$ </li>
</ul>

在<li>之间，我想插入<hr>代码，这样我就可以在顶部和底部项目之间设置一个线条边框（在一定数量的顶级项目之后）。使用索引（例如，如果索引== 4插入<hr>）不起作用，因为<hr>将在拖动时跟随<li>。 （拖动时需要固定位置）

有没有简单的方法可以做到这一点？现在，我只计算每个项目的高度（<li>的高度），并将<hr>放在窗口顶部的高度之后。 （而且我不能单独列出顶部和底部列表。）

感谢您的帮助。

Answer 1

如果你想要在视觉上显示一个小分割线，你可以使用css。

进行测试，在你的HTML代码中使用：

<style>
    ul li { border-top: solid 1px #ddd; padding: 4px 0; }
    ul li:first-child { border-top: 0; }
</style>

它具有相同的效果，但不影响DOM。