角度を使用してクリックすると特定のグリフコンの色を変更します

Question

角度アプリでクリックされた特定のグリフコンの色を変更したいと思います。例えば

これをクリックする：このボタンをクリックすると

(in ng-repeat block) <span class="glyphicon glyphicon-thumbs-down" ng-click="downvote(post)" ></span> 

それが呼び出されます：

$scope.downvote = function(post) { 
    posts.downvote(post); 
    } 
}; 

ありがとうございました。

Answer 1

あなたはポストの上にプロパティを設定することができます。

$scope.downvote = function(post) { 
    posts.downvote(post); 
    post.hadDownvote = true; 
}; 

が続いNG-style属性でプロパティをチェックしてください。

<span ng-style="post.hadDownvote ? {color:'red'} : {}" class="glyphicon glyphicon-thumbs-down" ng-click="downvote(post)"></span> 

当然、あなたはCSSクラスを使用することを好むかもしれリリースのために他の場所で定義され、ng-classで同じ検査を実行してクラスを追加します。

Answer 2

あなたはこれが、uはにデフォルトisDownVoteをASSING確認してくださいウルコントローラにそうの結合を介して、それを駆動するために持っている真または偽

$scope.downvote = function(post) { 
    posts.downvote(post); 
    post.isDownVoted = !post.isDownVoted; 
}; 

その後、ウルHTMLでこの

<span class="glyphicon glyphicon-thumbs-down" ng-click="downvote(post)" ng-class="post.isDownVoted===true ? 'some-color' : ''" ></span> 

幾分を行います色はあなたがur cssを置くことができるurクラスです。