У меня на экране есть несколько значков с большими значками шрифтовой awesome-библиотеки. Я хочу переключить цвет значка, который нажал.
Как это можно сделать в AngularJS?
.liked{
color:#0000ff;
}
.not-liked{
color:#888;
}
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
<div ng-app="" ng-controller="">
<a href="#" ng-click="" class="not-liked">
<i class="fa fa-thumbs-up" aria-hidden="true"></i>
</a>
</div>
Извините, я не написал часть AngularJS (метод щелчка), потому что я не знаю с помощью метода Angular (хотя я достиг этого с помощью jQuery).
Вы можете просто использовать директивы ng-click и ng-class.
.liked{
color:#0000ff;
}
.not-liked{
color:#888;
}
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
<div ng-app="" ng-controller="">
<a href="#" ng-class="{'not-liked':!liked,'liked':liked}" ng-click="liked=!liked">
<i class="fa fa-thumbs-up" aria-hidden="true"></i>
</a>
</div>
Изменить: удалено дополнительное ng-click.