Favorites

by Rob Rothe

HTML

<div ng-app="app" ng-controller="ItemsCtrl as ctrl">

  <div ng-repeat="item in ctrl.items">
    <button ng-click="ctrl.addToFav(item)" ng-class="{'favorite' : item.is_fav}"><i class="ion-heart"></i> {{item.title}}</button>
  </div>

</div>

CSS

.favorite {
  border: 1px solid red !important;
  background: red;
}

JavaScript

angular
  .module('app', [])
  .controller('ItemsCtrl', ItemsCtrl);


function ItemsCtrl() {
  var vm = this;

  vm.items = [{
    title: 'Neato',
    is_fav: 0
  }, {
    title: 'Cool',
    is_fav: 0
  }, {
    title: 'Awesome',
    is_fav: 1
  }, {
    title: 'Wow!',
    is_fav: 0
  }];

  vm.addToFav = addToFav;

  function addToFav(item) {
    item.is_fav = (item.is_fav) ? 0 : 1;
  }
}