Question

我正在将json文件中的列表值写入DOM。我想将每个文本对象设置为不同的颜色。我找到了一些资源来做这件事，但我还没有能够得到任何工作。

我的js：

.controller("Catalog", function($scope, $interval) {
 $scope.search = "";
 $scope.books = books;
 $scope.reverse = false;
 $scope.list = false;


 for(var i=0; i<10;i++){
  $scope.books[i] = {
  'color': ('#'+Math.floor(Math.random()*16777215).toString(16))
 };
 }
 });

和html：

  <div class="container result">
  <div ng-class="col s12 m6" class="books" ng-repeat="book in books | filter:search | orderBy:'book.doc.name':reverse" > <a href="https://address/{{book.doc.name}}" target="_blank">
      <img ng-class="list ? 'col s1'" alt="Click to read {{book.doc.name}}" title="Click to read {{book.doc.name}}" class="img-thumbnail" /></a>
      <h2 ng-class="list ? 'col s12 m6' ">
      {{book.doc.name}}   
      {{book.doc.languages}}
      </h2> 
      <p ng-class="list ? 'col-md-10' : 'col-md-12'">
     {{book.doc.subjects}}{{book.doc.tags}}</p> 
  </div>

Answer 1

您分配给books的{{1}}变量未设置。

你可以这样初始化： $scope.books 而不是像$scope.books = [];这样使用它： ng-repeat，因为您只在{{book.color}}循环上设置了color。

如果您设置了for，那么您可以设置所有书籍的颜色，如下所示：

$scope.books

这是JSFiddle Demo。

如何在角度中动态设置css颜色？

1 个答案: