:first-child 与 ng-repeat答案

【问题标题】：:first-child with ng-repeat:first-child 与 ng-repeat
【发布时间】：2014-10-27 02:43:31
【问题描述】：

我有一个 ng-repeat，只想将样式应用于 ng-repeat 中类 type 的第一个 div。

<div class="my-list" ng-repeat="item in list">
  <div class="type">
    <span>{{item.label}}</span>
  </div>
  <div class="check">
    <span>{{item.ischecked}}</span>
  </div>
</div>

我尝试了以下方法，但它将 CSS 应用于所有 divs 的类 type

.my-list .type:first-child

【问题讨论】：

标签： angularjs css angularjs-ng-repeat css-selectors

【解决方案1】：

您可以使用$first，它表示ng-repeat 中的第一次迭代。

<div class="my-list" ng-repeat="item in list">
  <div class="type" ng-class="{myClass:$first}">
    <span>{{item.label}}</span>
  </div>
  <div class="check">
    <span>{{item.ischecked}}</span>
  </div>
</div>

【讨论】：

@dmo 看来伪类正在被应用到注释掉的代码上，这是迭代中的第一个。

【解决方案2】：

基本上你需要反过来做。

.my-list:first-child .type{
  color:red;
}

ng-repeat 将放置多个.my-list div，并且您想单独定位第一个div 的.type。所以在.my-list上应用选择器。

【讨论】：