:first-child with ng-repeat

问题:

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

回答1:

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>

回答2:

Basically you need to do the other way around.

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

ng-repeat will put multiple .my-list divs and you want to target the .type of the first div alone. So apply selector on .my-list.

转载请标明出处::first-child with ng-repeat

文章来源: :first-child with ng-repeat