Javascript 使用带嵌套ng重复的角度：

我有一个ng repeat，我想在数组（album数组）中添加项目，这很好。我有颜色数组，它将为相册数组的卡片元素添加不同的背景色。结果不正确，我尝试将颜色数组设置为同一数组上的对象，但仍然得到错误的结果。谢谢你的帮助。这是你的电话号码。颜色数组应该循环，以等于相册数组中任意数量的相册

function MainController(albumSerivce, $filter) {
  'use strict';

  var ctrl = this;
  ctrl.albums = [];
  ctrl.arrayColor = ['red', 'blue', 'green', 'yellow'];
}

.green{
背景色：rgb（75,175,79）；
填充：10px；
}
瑞德先生{
背景色：rgb（255,86,34）；
填充：10px；
}
蓝先生{
背景色：rgb（61、121、182）；
填充：10px；
}
黄先生{
背景色：rgb（255，255，0）；
填充：10px；
}

{{album.title}

更新，我也尝试过这样做。我想不出来

{{album.title}
{{album.title}
{{album.title}
{{album.title}

如果您真的不想遍历颜色数组，您可以通过表达式为类赋值。让我知道是否适合你

<div class="album {{ctrl.arrayColor[$index%ctrl.arrayColor.length]}}" >
        <img class="image" ng-src="{{album.url}}" alt="" />
        <div class="title">{{album.title}}</div>
</div>

{{album.title}

如果您真的不想遍历颜色数组，您可以通过表达式为类赋值。让我知道是否适合你

<div class="album {{ctrl.arrayColor[$index%ctrl.arrayColor.length]}}" >
        <img class="image" ng-src="{{album.url}}" alt="" />
        <div class="title">{{album.title}}</div>
</div>

{{album.title}

不要尝试使用

ng repeat

在

colorArray

上循环，只需将ngClass与一个表达式一起使用即可生成一个颜色类。要实现循环，可以使用表达式

albumIndex%colorArrayLength

（索引数组长度）来获得正确的索引

ng-class="colorArray[$index%colorArray.length]"

$index

作为自动填充变量，angular将填充ng repeat的当前索引（在本例中为唱片集数组的索引）

angular.module（“app”，[]）.controller（“ctrl”，function（$scope）{
$scope.colorArray=[‘绿色’、‘红色’、‘蓝色’、‘黄色’]；
$scope.albums=[{
标题：“小猫1”，
url:“https://placekitten.com/g/100/100"
},
{
标题：“小猫2”，
url:“https://placekitten.com/g/100/100"
},
{
标题：“小猫3”，
url:“https://placekitten.com/g/100/100"
},
{
标题：“小猫4”，
url:“https://placekitten.com/g/100/100"
},
{
标题：“小猫5”，
url:“https://placekitten.com/g/100/100"
},
{
标题：“小猫6”，
url:“https://placekitten.com/g/100/100"
}];
});
#容器{display:flex；}
.album{flex:11 10；}
.album img{最大宽度：100%；}
格林先生{
背景色：rgb（75,175,79）；
填充：10px；
}
瑞德先生{
背景色：rgb（255,86,34）；
填充：10px；
}
蓝先生{
背景色：rgb（61、121、182）；
填充：10px；
}
黄先生{
背景色：rgb（255，255，0）；
填充：10px；
}

{{album.title}
不要尝试使用
ng repeat
在
colorArray
上循环，只需将ngClass与一个表达式一起使用即可生成一个颜色类。要实现循环，可以使用表达式
albumIndex%colorArrayLength
（索引数组长度）来获得正确的索引

ng-class="colorArray[$index%colorArray.length]"

$index
作为自动填充变量，angular将填充ng repeat的当前索引（在本例中为唱片集数组的索引）


angular.module（“app”，[]）.controller（“ctrl”，function（$scope）{
$scope.colorArray=[‘绿色’、‘红色’、‘蓝色’、‘黄色’]；
$scope.albums=[{
标题：“小猫1”，
url:“https://placekitten.com/g/100/100"
},
{
标题：“小猫2”，
url:“https://placekitten.com/g/100/100"
},
{
标题：“小猫3”，
url:“https://placekitten.com/g/100/100"
},
{
标题：“小猫4”，
url:“https://placekitten.com/g/100/100"
},
{
标题：“小猫5”，
url:“https://placekitten.com/g/100/100"
},
{
标题：“小猫6”，
url:“https://placekitten.com/g/100/100"
}];
});
#容器{display:flex；}
.album{flex:11 10；}
.album img{最大宽度：100%；}
格林先生{
背景色：rgb（75,175,79）；
填充：10px；
}
瑞德先生{
背景色：rgb（255,86,34）；
填充：10px；
}
蓝先生{
背景色：rgb（61、121、182）；
填充：10px；
}
黄先生{
背景色：rgb（255，255，0）；
填充：10px；
}

{{album.title}
代码笔向用户抛出意外的令牌错误me@NarainMittal现在试一试。如果专辑比颜色多，会发生什么？它应该从颜色数组的开始循环吗？如果是这样的话，为什么不在css上使用类似于N子类型的css选择器呢classes@PatrickEvans是的，我可以使用css选择器，这就是我最终要做的。但我从这里开始，好奇地想知道这样做是否可能/值得。代码笔向me@NarainMittal现在试一试。如果专辑比颜色多，会发生什么？它应该从颜色数组的开始循环吗？如果是这样的话，为什么不在css上使用类似于N子类型的css选择器呢classes@PatrickEvans是的，我可以使用css选择器，这就是我最终要做的。但我从这里开始，好奇地想知道这样做是否可能/值得。谢谢！Perfecto，正是我想要的。谢谢！Perfecto，正是我想要的。谢谢！正是我想要的，只是@narain先回答了。希望我能给他们两个获奖的答案。谢谢！正是我想要的，只是@narain先回答了。但愿我能给他们两个满意的答案。