在我的情况下如何将类添加到第一个html元素？

Question

我正在为我的应用使用角度框架。

我想只在ng-repeat的第一个元素中添加一个类。

<div class='onlyFirst' ng-repeat = 'task in tasks'>{{task.chore}}</div>

但是，上面的代码将适用于我的所有div，我只需要第一个具有onlyFirst类的div。无论如何要做到这一点？

非常感谢！

Answer 1

尝试这样的事情：

ng-class="{onlyFirst : $first}" 

所以你的代码看起来像这样：

<div ng-repeat = 'task in tasks'>
    <div ng-class="{onlyFirst : $first}">{{task.chore}}</div>
</div>

参考： http://docs.angularjs.org/api/ng/directive/ngRepeat

Answer 2

您可以使用ng-class和ng-repeat中可用的$ first变量。

<div  
   ng-repeat = 'task in tasks' 
   ng-class="{onlyFirst:'$first'}"
   >{{task.chore}}</div>

相关文档：

• http://docs.angularjs.org/api/ng/directive/ngRepeat
• http://docs.angularjs.org/api/ng/directive/ngClass

Answer 3

如果您只想将特定的CSS应用于第一个孩子，您还可以利用CSS＆＃39;第一个子选择器：

http://www.w3schools.com/cssref/sel_firstchild.asp