AngularJS中的$ index索引

Question

我想在我的應用程序中使用datepicker實現不同的日期。我有一個複選框，如果用戶選中該複選框，然後添加日期。 但似乎索引跟蹤不起作用。

這裏是我的代碼 -

<div class="form-group">  
    <label>6. Enter Onsite Details(Up to 4)</label> <br> 
     <div ng-repeat="selecting in selects track by $index" > 
      <div class="datePicker"> 
       <button 
       bs-datepicker 
       class="btn btn-info" id="comm_cal_bttn" 
       name="date" 
       data-animation="am-flip-x" 
       data-autoclose="true" 

       ng-blur="getMinTime(index);" 
       ng-model="selects[index].commDate"> 
        <i class="fa fa-fw fa-calendar" aria-hidden="true"></i> Date 
       </button> 
       &nbsp; 
       <p ng-show="selects[index].commDate"> 
        {{selects[index].commDate}} <span class="text-muted"> {{selects[index].commDate}}</span> {{combinedTime.format('h:mm A')}} 
       </p> 
      </div> 
      <input type="checkbox" ng-click="addMore(keyAdd);" ng-model="keyAdd"> 
      <label for="dateCheck">Add Additional</label> 

</form> 

上方選擇日期代碼正在調用一個函數getMinTime(index)，但指標顯示在我的控制器定義。

我的控制器 -

$scope.selects = [{commDate : null}]; 
$scope.getMinTime = function(index){ 

// here index is showing undefined 
} 

我想執行基於索引值的一些操作。假設我添加了4個日期。我在這裏做什麼？任何建議？

Answer 1

您需要通過$index作爲一個參數不index

<!-- other code --> 

<div class="form-group"> 
    <label>6. Enter Onsite Details(Up to 4)</label> 
    <br> 
    <div ng-repeat="selecting in selects track by $index"> 
    <div class="datePicker"> 
     <button bs-datepicker class="btn btn-info" id="comm_cal_bttn" name="date" data-animation="am-flip-x" data-autoclose="true" ng-blur="getMinTime($index);" ng-model="selects[$index].commDate"> 
     <i class="fa fa-fw fa-calendar" aria-hidden="true"></i> Date 
     </button> 
     &nbsp; 
     <p ng-show="selects[$index].commDate"> 
     {{selects[$index].commDate}} <span class="text-muted"> {{selects[$index].commDate}}</span> {{combinedTime.format('h:mm A')}} 
     </p> 
    </div> 
    <input type="checkbox" ng-click="addMore(keyAdd);" ng-model="keyAdd"> 
    <label for="dateCheck">Add Additional</label> 

    <!-- other code -->