:first-child with ng-repeat [英] :first-child with ng-repeat

问题描述

我有一个 ng-repeat 并且只想将样式应用到第一个 div 和 ng-repeat 中的 type 类.

<div class="type"><span>{{item.label}}</span>
<div class="check"><span>{{item.ischecked}}</span>

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

.my-list .type:first-child

解决方案

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

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

I have an ng-repeat and only want to apply a style to the first div with the class type in the ng-repeat.

<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>

I have tried the following but it applied the CSS to all the divs with a class of type

.my-list .type:first-child

解决方案

You can use $first, that indicates the first iteration within a 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>

这篇关于:first-child with ng-repeat的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！