Question

我的风格有三节课，例如红色，绿色和蓝色

显示div中的项目列表，我的要求是按迭代值（按顺序）添加类。例如

{"userid":"964"}

这是我的代码

1st div - red
2nd div - green 
3rd div - blue
4th div - red
5th div - green
.
.
(repeat will proceed till last iteration)
(repeat

Answer 1

您必须使用ng-class代替class属性

ng-class="{ 'item-br-color-type-red': ($index%3)==0 , 
            'item-br-color-type-green': ($index%3)==1 , 
            'item-br-color-type-blue': ($index%3)==2 }"

Answer 2

您的代码可能没问题，您只需将class更改为ng-class，以便Angular对其进行评估。

<div ng-class="item item-text-wrap item-br-color-type-{{$index + 1}}-1">...</div>

Answer 3

尝试这样。

var app = angular.module('main', []);
app.controller('DemoCtrl', function ($scope,$filter) {
$scope.colors =[ 
     'red',
     'blue',
     'green',
     'pink'];
   $scope.items =
     [
       {name:"item1"},
       {name:"item2"},
        {name:"item3"},
        {name:"item4"},
      {name:"item4"}
    ];
  
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-controller="DemoCtrl" ng-app="main">
   <div ng-repeat="n in items"   ng-style="{'background-color' : colors[$index%4]}" >
       {{n.name}}
   </div>
</div>

如何根据循环中的迭代次数添加类

3 个答案: