AngularJs ng-repeat是在復選框上注冊兩次單擊事件嗎？

Question

https://jsfiddle.net/ytygc19t/2/

HTML：

<div ng-app="app" ng-controller="MainCtrl">
  <span>Test App @ </span> status:{{loaded}}
<hr>

  <div ng-repeat="checkbox in checkBoxArray track by $index">{{checkbox}}
    <input name="x{{checkbox}}"  id="x{{checkbox}}" ng-click="removeCheckBox(checkbox)" type="checkbox"/>
  </div>
</div>

JS：

angular.module("app",[])
.controller("MainCtrl", ["$scope", "$timeout", function($scope, $timeout){
   $scope.checkBoxArray = ["a", "b", "c", "d", "e"]
   $scope.loaded = "loaded";

   $scope.removeCheckBox = function (value){
      $timeout(function(){
         $scope.checkBoxArray.splice($scope.checkBoxArray.indexOf(value), 1);
      }, 300)       
   }
}])

當我選中復選框a時，a被刪除，b也被選中

Answer 1

track by $index刪除track by $index因為每次選擇a時，都將刪除a，而此時b索引將變為1，因此將對其進行檢查。

在這里找到可用的小提琴： https : //jsfiddle.net/varit05/ytygc19t/3/

希望對您有幫助！

干杯!

Answer 2

我認為您遇到的是HTML復選框功能和Angular功能之間的沖突。 嘗試使用角度跟蹤復選框的值。

<li ng-repeat="item in Items">
  <label>{{item.Name}}
    <input type="checkbox" ng-model="item.Selected" ng-click="item.Selected = true" />
  </label>
</li>

並在控制器中

$scope.Items = [{Name: 'bla', Selected: false}, ...]

此外，是否有任何特定原因需要您按$ index進行跟蹤 ？ 那也可能給您帶來一些問題。