Angularjs 角度：手表不在回路内工作

在angular中，如果我动态地注册手表事件（在for循环中），手表就不工作。请看一把小提琴。有什么想法吗

var myApp = angular.module('myApp',[]);


function MyCtrl($scope, $parse) {

    // 1. binding watch inside loop (doesn't work):
    $scope.aaa = 1;
    $scope.bbb = 2;

    $scope.dependsOn = [
        function () { return $scope.aaa; },  
        function () { return $scope.bbb; }
    ];        

    for (var i = 0; i < $scope.dependsOn.length; i++) {        

        $scope.$watch(
            function () {
                return $scope.dependsOn[i];                    
            },
            function (newVal) {
                if (newVal !== undefined) {
                    console.log("doesn't work");
                }
            }
        );
    }    

    $scope.aaa = 5;
    $scope.bbb = 6;    

    // binding watch not inside loop (works):

    $scope.ccc = 1;
    $scope.ddd = 2;    

    $scope.dependsOn = [
        function () { return $scope.ccc; },
        function () { return $scope.ddd; }
    ];    

    $scope.$watch(
        function () {
            return $scope.dependsOn[0];                    
        },
        function (newVal) {
            if (newVal !== undefined) {
                console.log("works");
            }
        }
    );    

    $scope.$watch(
        function () {
            return $scope.dependsOn[1];                    
        },
        function (newVal) {
            if (newVal !== undefined) {
                console.log("works");
            }
        }
    );     

    $scope.ccc = 5;
    $scope.ddd = 6;      
}

var myApp=angular.module（'myApp'，[]）；
函数MyCtrl（$scope$parse）{
//1.绑定手表内循环（不工作）：
$scope.aaa=1；
$scope.bbb=2；
$scope.dependsOn=[
函数（）{return$scope.aaa；}，
函数（）{return$scope.bbb；}
];        
对于（var i=0；i<$scope.dependsOn.length；i++）{
$scope.$watch(
函数（）{
返回$scope.dependsOn[i]；
},
函数（newVal）{
if（newVal！==未定义）{
console.log（“不工作”）；
}
}
);
}    
$scope.aaa=5；
$scope.bbb=6；
//绑定手表不在环路内（工作）：
$scope.ccc=1；
$scope.ddd=2；
$scope.dependsOn=[
函数（）{return$scope.ccc；}，
函数（）{return$scope.ddd；}
];    
$scope.$watch(
函数（）{
返回$scope.dependsOn[0]；
},
函数（newVal）{
if（newVal！==未定义）{
控制台日志（“工作”）；
}
}
);    
$scope.$watch(
函数（）{
返回$scope.dependsOn[1]；
},
函数（newVal）{
if（newVal！==未定义）{
控制台日志（“工作”）；
}
}
);     
$scope.ccc=5；
$scope.ddd=6；
}

---

您遇到的问题是因为您在闭包中捕获变量

i

。然后

i

增加到值2并退出循环，在实际执行委托时，每个委托的

i

值将为2

表明： （加：）

您可以通过使用自调用闭包来捕获迭代时的值并为您的委托维护该值，从而解决此问题和变量提升问题

for（var i=0；i<$scope.dependsOn.length；i++）{
var watchDelegate=（函数（itemDelegate）{
返回函数（）{
返回项委托；
};
})（$scope.dependsOn[i]）；
$scope.$watch(
值班代表，
函数（newVal）{
if（newVal！==未定义）{
log（newVal（））；
}
}
);
}

$scope.$watch(
     function () {
         console.log(i);
         return $scope.dependsOn[i];                    
     },
    function (newVal) {
         if (newVal !== undefined) {
              console.log("doesn't work");
         }
    }
);

for (var i = 0; i < $scope.dependsOn.length; i++) {        
     var watchDelegate = (function(itemDelegate){
          return function () {
              return itemDelegate;                    
          };
      })($scope.dependsOn[i]);

      $scope.$watch(
          watchDelegate,
          function (newVal) {
              if (newVal !== undefined) {
                  console.log(newVal());
              }
          }
      );
  }