题 Ng重复中的角度设定类


我正在创建一个列表 ng-repeat ,我需要全力以赴 li 他们父亲的第n个孩子或更多的元素,某个阶级(在我们的 ng-repeat 它表示所有索引大于中等的孩子。例如,如果列表是10个项目,我需要给出第5个,第6个......第10个 li 孩子们上课。 所以,如果我的代码是这样的 -

 [ul]
    [li  ng-repeat="friend in friends"]
       {{friend.name}} who is {{friend.age}} years old.
    [/li]
  [/ul]

从中间索引及以上索引给孩子分类的可能和好的方法是什么?我的条件是我不应该改变html的结构。我可以补充一下 directives\filters 或添加东西到控制器。


14
2017-08-27 14:31


起源


只需添加类似的东西 ng-class="{'yourClass': $index > friends.length / 2}" 在李。 - Yoshi
看起来像黑魔法,你确定它会起作用吗? - Joel_Blum
是的,我很确定;)如果逻辑可能会发生变化,你当然可以从视图中提取它并让控制器决定。例如: ng-class="someConrollerMethod($index, friends)" - Yoshi
@Yoshi,你应该创建一个答案。也许是一个jsfiddle。 - Brian Lewis
我有点短:ng-class =“{'class-name':$ index> $ middle}” - tschiela


答案:


简单地用 ng-class 在重复元素上,例如:

<li
  ng-repeat="friend in friends"
  ng-class="{special: $index > friends.length / 2 - 1}">

  {{friend.name}}
</li>

演示: http://jsbin.com/iFigAYi/1/


或提取逻辑,如:

<ul>
  <li ng-repeat="friend in friends" ng-class="getClass($index, friends)">
    {{friend.name}}
  </li>
</ul>

$scope.getClass = function getClass(idx, list) {
  return {
    special: idx > list.length / 2 - 1
  };
};

29
2017-08-27 14:48



我发现“特殊”必须在引号中 - nuander