使用AngularJS </ul>渲染<ul>列表元素时出现问题

Question

我有一个Angular View，使用<li>

呈现ng-repeat个元素

<li>元素具有以下CSS

li:last-child {

    border-radius: 0 0 0 10px;
}

li:first-child {
    border-radius: 10px 0 0 0;
}

基本上，我正在尝试为第一个和最后一个li元素创建圆角。但问题是角度将样式表应用于每个li元素处理为第一个元素（或者如果我能够按照上面的样式的顺序，最后一个元素），同时渲染每个连续的元素。有什么帮助吗？

更新

这是HTML

<ul ng-repeat="artist in artists" >
                <li ><a href="http://www.google.com" >{{artist.firstName}}</a></li>
 </ul>

控制器非常简单，可以与Json数据一起使用。让我们说艺术家的人口很完美。

Answer 1

您的代码表示：对于artists数组中的每位艺术家，都会生成以下HTML：

<ul>
    <li><a href="http://www.google.com" >{{artist.firstName}}</a></li>
</ul>

这不是你想要的。你想要的是一个ul，里面有多个li：

<ul>
    <li ng-repeat="artist in artists"><a href="http://www.google.com" >{{artist.firstName}}</a></li>
</ul>

只需在浏览器中查看生成的HTML开发工具窗口就可以让您找到问题。