実装の星の評価角度

Question

私は新しい角度です。角張ったページがあります。特定のユーザーを評価するオプションがあります。しかし、私はそれを実装する方法を知らない？私は唯一のコードを持っています

<div class="col-xs-12 col-sm-6 col-md-7 col-lg-12 no-padding">Overal Rating: 
    <span class="fa fa-star-o"></span> 
    <span class="fa fa-star-o"></span> 
    <span class="fa fa-star-o"> </span> 
    <span class="fa fa-star-o"> </span> 
    <span class="fa fa-star-o"></span> 
</div> 

私は問題を解決するのに役立つことができますか？

Answer 1

SSHは私が集めることができるものから、あなたの質問の下で彼のコメントにリンクされjsfiddleに

をより良い例を与え、そしてあなたは、ユーザーが（星の＃を与えるためにクリックする何かをしたいと仮定すると1-5）、あなたはsetStarsがインクルードは、ユーザーが自分の評価とlitStarsのために星の＃を設定することができます関数は、要素のCSSを制御機能である。この

<div class="col-xs-12 col-sm-6 col-md-7 col-lg-12 no-padding">Overal Rating: 
    <span class="fa fa-star-o" data-ng-repeat="number in [1,2,3,4,5] track by $index" data-ng-click="setStars($index)" data-ng-style="litStars($index)"></span> 
</div> 

ような何かを行うことができます... 、おそらく背景色や何か。あなたの.jsファイル内

：

app.controller('yourApp', ['$scope', function($scope){ 
    $scope.stars = 0; 
    $scope.setStars = function(value){ 
     $scope.stars = value; 
    }; 
    $scope.litStars = function(value){ 
     if($scope.stars>=value){ 
      return { "background-color" : "yellow" }; 
     } 
     else { 
      return { "background-color" : "white" }; 
     } 
    }; 

Answer 2

app.controller('yourApp', ['$scope', function($scope){ 
    $scope.stars = 0; 
    $scope.setStars = function(value){ 
     $scope.stars = value+1; 
    }; 
    $scope.litStars = function(value){ 
     if($scope.stars>value){ 
      return { "color" : "yellow" }; 
     } 
     else { 
      return { "color" : "grey" }; 
     } 
    };