角度：手表不工作内部循环

Question

如果我动态注册手表事件（在我的情况下为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;  
} 

fiddle

Answer 1

您所遇到的问题是因为你捕捉一个封闭的可变i。然后i会增加到值2并退出循环，在您实际执行委托时，您的每位代表都将拥有2个值作为它们的i值。

演示： http://jsfiddle.net/df6L0v8f/1/ （增加:)

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

您可以通过使用自闭打电话来捕捉在迭代的时间价值，并坚持认为，解决这一问题及可变提升的问题你代表。

http://jsfiddle.net/df6L0v8f/4/

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()); 
       } 
      } 
    ); 
    }