javascript - 2 回の ng-repeat、$index が 2 回目の ng-click で正しい値を送信しない

Question

同じディレクティブで互いに続く 2 つの ng-repeat があります。

<section slider class="slider">
    <nav>
        <ul>
            <li ng-repeat="slide in slider[0]" ng-class="{'active':isCurrentSlideIndex($index)}" ng-click="setCurrentSlideIndex($index)" class="no-text"></li>
        </ul>
    </nav>
    <ul>
        <li ng-repeat="slide in slider[0]" ng-class="{'active':isCurrentSlideIndex($index)}" class="grid" ng-click="setCurrentSlideIndex($index+1)">
            <img ng-src="{{slide.image}}" alt="" />
        </li>
    </ul>
</section><!-- section.slider -->

最初の ng-click="setCurrentSlideIndex($index)" は問題なく動作しています。ただし、2 番目のものは常に $index の最後の値を送信します (たとえば、3 つの画像がある場合、常に 2 になります)。( isCurrentSlideIndex($index) は適切に機能します。)

これを修正する方法はありますか？

ありがとうございました

アップデート：

angular.module('app')
  .directive('slider', function () {
    return {
      restrict: 'A',
      scope: true,
      controller: function($scope){
        $scope.currentIndex = 0;
        $scope.setCurrentSlideIndex = function(index){
        $scope.currentIndex = index;
        };
        $scope.isCurrentSlideIndex = function(index){
        return $scope.currentIndex === index;
        };
      }
    };
  });