i'm trying to set a random background color from an array in each element in a ng-repeat. This is a simple fiddle i made:
As you can see, my problem is i can't set the color in each "row" but it's set in all rows the same. I can't understand how fix that. I also tried using an id="$index" but not works. Here's some code:
<div ng-app="myApp" ng-controller="dummy">
<div ng-repeat="customer in customerData" class="col-sm-3">
<div ng-init="getRandomColor()" class="contact-box" ng-style="{background: bgColor}"> {{customer.name}} got: {{customer.color}}</div>
</div>
</div>
angular.module('myApp', ['ngSanitize'])
.controller('dummy', ['$scope', function ($scope) {
$scope.doc_classes_colors = [
"#339E42",
"#039BE5",
"#EF6C00",
"#A1887F",
"#607D8B",
"#039BE5",
"#009688",
"#536DFE",
"#AB47BC",
"#E53935",
"#3F51B5"
];
$scope.bgColor = "#339E42";
$scope.getRandomColor = function () {
$scope.bgColor = $scope.doc_classes_colors[Math.floor(Math.random() * $scope.doc_classes_colors.length)];
};
$scope.customerData = [{
name: "Mike"
}, {
name: "Tom"
}, {
name: "ASD"
}, {
name: "Lol"
}];
}]);
Aucun commentaire:
Enregistrer un commentaire