Question

我有一个Icon和一个scope.id，我每次都用Icon分配不同的颜色代码。假设

angular.module('myAppp').controller('myCtrl',function(){
    scope.id=[0,1,2,3];
    //generate random number
    $scope.Icon=[];
    for(i=0;i<scope.id.length;i++) {
        var ran= Math.floor( Math.random()*255)+$scope.id[i];
        $scope.Icon.push(ran);
    }   
});

HTML

<div ng-repeat='id in id'>
    <span style="background-color:rgb({{$scope.Icon[$index]}},255,255)">{{id}}</span>
</div>

所以我希望当我再次重新加载我的页面时它应该再次获得相同的颜色，但现在它将返回不同的颜色，因为Math.random（）

请建议我或指导我，因为我是新人。

Answer 1

您可以使用cookies存储当前值。

每次加载页面检查是否存在先前存储的Cookie，如果没有，则指定随机值并将其存储在新 Cookie中。

每次更改颜色时，都必须将值分配给cookie，因此每次用户加载或重新加载页面时，如果已有值，则将颜色设置为cookie中的颜色。

以下是如何在angularjs中使用cookie的示例：
http://www.tutorialsavvy.com/2014/11/angularjs-cookie-example.html/

Answer 2

实现选择初始种子到随机数生成算法;它不能被用户选择或重置

来自JavaScript reference。

使用预生成的数字数组。

Answer 3

以下是页面加载时动态颜色更改的示例：http://fiddle.jshell.net/xopddsxp/

<强> HTML：

<div ng-app="myAppp" ng-controller="myCtrl">
    <div ng-repeat='id in id'>
        <span style="background-color:rgb({{Icon[$index]}},{{Icon[$index +1]}},{{Icon[$index + 2]}})">{{id}}</span>
    </div>
</div>

<强> JS：

var app = angular.module("myAppp", []).controller('myCtrl',function($scope, $http){
     $scope.id = [0,1,2,3]; //generate random number
     $scope.Icon=[];
     for(i=0; i < $scope.id.length; i++){  
       var ran= Math.floor( Math.random()*255)+$scope.id[i];
       $scope.Icon.push(ran);
     }  
});

每次加载控制器时生成相同的随机数

3 个答案: