Angularjs 使用角度重复生成随机颜色
如何在ng repeat中生成随机颜色。 我试着用下面的方法,但没有成功 我得到一个错误,说:Angularjs 使用角度重复生成随机颜色,angularjs,Angularjs,如何在ng repeat中生成随机颜色。 我试着用下面的方法,但没有成功 我得到一个错误,说: Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting! 控制器 看法 以下是一个工作: HTML: 请尝试使用ng init和ng style 视图: 尝试为customerData数组(javascript)中的每个元素添加随机值(随机样式)。 $scope.getRandomColor = function()
Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
控制器
看法
以下是一个工作:
HTML:
请尝试使用
ng init
和ng style
视图:
尝试为customerData数组(javascript)中的每个元素添加随机值(随机样式)。
$scope.getRandomColor = function(){
return {
borderLeft: '2px solid # '+Math.floor((Math.random()*6)+1)
}
};
<div ng-repeat="customer in customerData" class="col-sm-3">
<div class="contact-box" ng-style="getRandomColor()">
</div>
</div>
<div ng-app="myApp" ng-controller="dummy">
<div ng-repeat="customer in customerData" class="col-sm-3">
<div class="contact-box" ng-style="customer.color"> {{customer.name}} got: {{customer.color}}</div>
</div>
</div>
angular.module('myApp', ['ngSanitize'])
.controller('dummy', ['$scope', function ($scope) {
var getRandomColor = function () {
return {
borderLeft: '2px solid #' + Math.floor(Math.random()*16777215).toString(16)
}
};
$scope.customerData = [{
name: "Mike",
color: getRandomColor()
}, {
name: "Tom",
color: getRandomColor()
}];
}]);
<div ng-repeat="customer in customerData" class="col-sm-3">
<div class="contact-box" ng-init="customer.color = getRandomColor()" ng-style="customer.color">
</div>
</div>
$scope.getRandomColor = function(){
return {
borderLeft: '2px solid # '+ Math.floor(Math.random() * 16777215).toString(16)
}
};