From e214c31582a6fb5f9ec67780dabed320272b8b79 Mon Sep 17 00:00:00 2001
From: Tasos Bekos <tbekos@gmail.com>
Date: Sat, 1 Feb 2014 21:21:04 +0100
Subject: [PATCH] refactor(carousel): use `track by` in template

---
 src/carousel/carousel.js        | 12 ++----------
 src/carousel/docs/demo.html     |  2 +-
 template/carousel/carousel.html |  8 ++++----
 3 files changed, 7 insertions(+), 15 deletions(-)

diff --git a/src/carousel/carousel.js b/src/carousel/carousel.js
index 90be0e7272..13ff8743c1 100644
--- a/src/carousel/carousel.js
+++ b/src/carousel/carousel.js
@@ -9,14 +9,14 @@
 angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition'])
 .controller('CarouselController', ['$scope', '$timeout', '$transition', function ($scope, $timeout, $transition) {
   var self = this,
-    slides = self.slides = [],
+    slides = self.slides = $scope.slides = [],
     currentIndex = -1,
     currentTimeout, isPlaying;
   self.currentSlide = null;
 
   var destroyed = false;
   /* direction: "prev" or "next" */
-  self.select = function(nextSlide, direction) {
+  self.select = $scope.select = function(nextSlide, direction) {
     var nextIndex = slides.indexOf(nextSlide);
     //Decide direction if it's not given
     if (direction === undefined) {
@@ -96,18 +96,10 @@ angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition'])
     }
   };
 
-  $scope.select = function(slide) {
-    self.select(slide);
-  };
-
   $scope.isActive = function(slide) {
      return self.currentSlide === slide;
   };
 
-  $scope.slides = function() {
-    return slides;
-  };
-
   $scope.$watch('interval', restartTimer);
   $scope.$on('$destroy', resetTimer);
 
diff --git a/src/carousel/docs/demo.html b/src/carousel/docs/demo.html
index 9c5adbc44a..080fed136c 100644
--- a/src/carousel/docs/demo.html
+++ b/src/carousel/docs/demo.html
@@ -12,7 +12,7 @@ <h4>Slide {{$index}}</h4>
   </div>
   <div class="row">
     <div class="col-md-6">
-      <a class="btn btn-info" ng-click="addSlide()">Add Slide</a>
+      <button type="button" class="btn btn-info" ng-click="addSlide()">Add Slide</button>
     </div>
     <div class="col-md-6">
       Interval, in milliseconds: <input type="number" class="form-control" ng-model="myInterval">
diff --git a/template/carousel/carousel.html b/template/carousel/carousel.html
index 167996563e..d622e7e98f 100644
--- a/template/carousel/carousel.html
+++ b/template/carousel/carousel.html
@@ -1,8 +1,8 @@
 <div ng-mouseenter="pause()" ng-mouseleave="play()" class="carousel" ng-swipe-right="prev()" ng-swipe-left="next()">
-    <ol class="carousel-indicators" ng-show="slides().length > 1">
-        <li ng-repeat="slide in slides()" ng-class="{active: isActive(slide)}" ng-click="select(slide)"></li>
+    <ol class="carousel-indicators" ng-show="slides.length > 1">
+        <li ng-repeat="slide in slides track by $index" ng-class="{active: isActive(slide)}" ng-click="select(slide)"></li>
     </ol>
     <div class="carousel-inner" ng-transclude></div>
-    <a class="left carousel-control" ng-click="prev()" ng-show="slides().length > 1"><span class="icon-prev"></span></a>
-    <a class="right carousel-control" ng-click="next()" ng-show="slides().length > 1"><span class="icon-next"></span></a>
+    <a class="left carousel-control" ng-click="prev()" ng-show="slides.length > 1"><span class="icon-prev"></span></a>
+    <a class="right carousel-control" ng-click="next()" ng-show="slides.length > 1"><span class="icon-next"></span></a>
 </div>