Angularjs: eine Klasse mit ng-Klasse ändern und eine Klick-Funktion

Question

ich dieses Array von Objekten auf meinem Controller haben (self.years)

var self = this; 

    self.years =[ 
     {"year":"2010"}, 
     {"year":"2011"}, 
     {"year":"2012"}, 
     {"year":"2013"}, 
     {"year":"2014"}, 
     {"year":"2015"} 
    ]; 

In meinem Markup Ich bin mit, dass ein machen Taste für jedes Objekt mit ng-repeat:

  <div class="btn-container col-md-2" ng-repeat="year in ctrl.years"> 
      <button class='btn year-btn' year="{{$index}}" ng-click="ctrl.updateYear($index)">{{year.year}}</button> 
     </div> 

Wenn auf meinem Controller habe ich einen yearSelected bereits dazu Klick-Funktion für jede Taste, dass yearSelected zu ändern:

self.yearSelected = self.years[5]; 

self.updateYear = function(indexSelected) { 
    self.yearSelected = self.years[indexSelected]; 
}; 

... Wie gebe ich die entsprechende Schaltfläche an yearSelected eine "ausgewählte" Klasse mit ng-Klasse?

Answer 1

self.updateYear = function(indexSelected) { 
    self.currentIndex = indexSelected; // add this 
    self.yearSelected = self.years[indexSelected]; 
}; 

Auf der Benutzeroberfläche ng-Klasse hinzufügen = "{ 'aktiv': $ index === Momentan}", um Ihre Schaltfläche

Answer 2

self.yearSelected = self.years[0]; 

self.updateYear = function(year) { 
    self.yearSelected = year; 
}; 


<div class="btn-container col-md-2" ng-repeat="obj in ctrl.years"> 
    <button class='btn year-btn' ng-click="ctrl.updateYear(obj)">{{obj.year}}</button> 
</div> 

//use ng-class="{active: self.yearSelected === obj.year }"