angularjs - 将对象传递给 $timeout

Question

我需要做一些特别的事情来访问 $timeout 函数中的对象吗？

当我尝试在 $timeout 函数中访问它时，我收到错误消息说路由未定义，但在 $timeout 函数（控制台日志所在的位置）之外，它会记录对象并且其中的所有内容都符合预期：

$scope.drawRoutes = function(routes) {
  console.log(routes);
  for (var i = 0; i < routes.length; i++) {
     $timeout(function() {
        MapService.directionsService.route(routes[i], function(response, status) {
           if (status == google.maps.DirectionsStatus.OK) {
              MapService.direction_renderers.push(new google.maps.DirectionsRenderer());
              MapService.direction_renderers[MapService.direction_renderers.length - 1].setMap(MapService.gmaps.map);
              MapService.direction_renderers[MapService.direction_renderers.length - 1].setDirections(response);
              $scope.connectors_created += 1;
              $scope.$digest();
           }
        });
     }, 1000);
   }
};

Answer 1

这里的问题是i在超时回调函数中使用闭包变量......在每个回调实例中都i引用相同的闭包实例......所以当循环退出时i具有routes.length导致在callbak中访问的值，routes[routes.length]这将是未定义的。

假设routes 是一个数组对象，可以使用 forEach() 迭代器函数来解决问题

$scope.drawRoutes = function (routes) {
    console.log(routes);
    angular.forEach(routes, function (route, idx) {
        $timeout(function () {
            MapService.directionsService.route(route, function (response, status) {
                if (status == google.maps.DirectionsStatus.OK) {
                    MapService.direction_renderers.push(new google.maps.DirectionsRenderer());
                    MapService.direction_renderers[MapService.direction_renderers.length - 1].setMap(MapService.gmaps.map);
                    MapService.direction_renderers[MapService.direction_renderers.length - 1].setDirections(response);
                    $scope.connectors_created += 1;
                    $scope.$digest();
                }
            });
        }, (idx + 1) * 1000);
    })
};