使用 ng-repeat 分配随机样式值答案

【问题标题】：Use ng-repeat assign random style value使用 ng-repeat 分配随机样式值
【发布时间】：2015-05-19 18:42:57
【问题描述】：

我使用 $http 调用提取用户列表，我会在这样的 div 中显示每个随机名称：

<div class="circle colorxxx x6" style="top:197px;left:168px;width:110px;height: 110px"></div>

对于每个 div，我会随机更改样式值（顶部、左侧宽度和高度）。怎么可能？我看到了 ng-class-even 和 odd 的使用，但是对于许多结果我有重叠的 div！

【问题讨论】：

Place random non-overlapping rectangles on a panel 的可能重复项

标签： angularjs

【解决方案1】：

您可以使用 ng-repeat 和 ng-class 来获取随机值，您应该使用控制器中的函数来生成随机类。您可以将 ng-class 和 class 用于 div。将应该在所有 div 中的那些放在 class 属性中，将随机的放在 ng-class 属性中：

HTML：

<div ng-class="getRandomClass()" class="circle" style="top:197px;left:168px;width:110px;height: 110px" ng-repeat="user in users"></div>

控制器：

$scope.getRandomClass = function() {
    // Generate random string to set as class
}

【讨论】：

好主意....我不太熟悉获取 Random.... 是这样的吗？ $scope.getRandomClass = function() {var show = myShows[Math.floor(Math.random() * myShows.length)];}
我的目标是这样的。

【解决方案2】：

随机出现错误，这是我的控制器：

var myShows = ['fucsia x1','violetto x2','celeste x3','arancio x4','rosso x5'];
    $scope.getRandomClass = function() {
        return myShows[Math.floor(Math.random() * myShows.length)];
    }
    $http.post('http://www.mimanchitu.it/ap/include/user_rand.asp')
    .success(function(ut){$scope.uts = ut;})
    .error(function(){alert("Errore di connessione!")})

这是我的模板：

<div ng-repeat="ut in uts" style="background-image:url({{ut.avatar}})" class="circle" ng-class="getRandomClass()"><a href="#/app/showprof/{{ut.id}}/" class="secondary-content">{{ut.name}}</a></div>

错误是Error Reference / $rootScope / infdig 为什么？！

【讨论】：