An array of objects can not be seen in the method. (angularjs)

Question

Sorry for my english.

chill.controller('messagesController', function($scope, $http, $rootScope, $location, $stateParams, $ionicSlideBoxDelegate, $ionicLoading) {

if ($rootScope.userData != undefined) {
    $ionicLoading.show({
        template: 'loading'
    })
    $http.get('http://api.getchill.co/api/v1/messages/index/id_user/'+$rootScope.userData.id_user+'/id_contact/'+$stateParams.id)
    .success(function(data) {
        $scope.messages = data;
        for (var i = 0; i < $scope.messages.response.length; ++i) {
            if ($scope.messages.response[i].type == 'location') {
                var strings = $scope.messages.response[i].content.split(' ');
                var lat1 = strings[0], lat2 = strings[1];
                $http.get('http://maps.googleapis.com/maps/api/geocode/json?latlng='+lat1+','+lat2+'&sensor=false')
                .success(function(data) {
                    $ionicLoading.hide();
                    $scope.messages.response[i].address = data.results[0].formatted_address;
                });
            };
        };
        $ionicSlideBoxDelegate.update();
    });
}
else
{
    $location.path('/login');
};

});

$scope.messages.response[i].address is undefined in the success() function. I can't figure out why.

TypeError: Cannot set property 'address' of undefined
    at messagesController.js:17
    at ionic.bundle.js:17151
    at processQueue (ionic.bundle.js:20962)
    at ionic.bundle.js:20978
    at Scope.$eval (ionic.bundle.js:22178)
    at Scope.$digest (ionic.bundle.js:21994)
    at Scope.$apply (ionic.bundle.js:22282)
    at done (ionic.bundle.js:17439)
    at completeRequest (ionic.bundle.js:17629)
    at XMLHttpRequest.requestLoaded (ionic.bundle.js:17570)

console.log(data): _https://dl.dropboxusercontent.com/u/99426050/ShareX/2015/01/2015-01-29_23-40-29.png

Is the problem that the address is not visible or is the problem that the addres is 'undefined'? — Jochen van Wylick, Jan 29 '15 at 20:25
try `console.log(data);` in the success function and update the question with the details — Scriptable, Jan 29 '15 at 20:32

score 1 · Answer 1 · edited May 23 '17 at 12:21

The problem here is that the value of i has changed when the success function is called. i is now the length of the array (because the for loop has ended). $scope.messages.response[i] returns undefined because you're asking for a value at the index after the last index. This is due to the behavior of scoping and closures.

angular.forEach can help you.

chill.controller('messagesController', function($scope, $http, $rootScope, $location, $stateParams, $ionicSlideBoxDelegate, $ionicLoading) {

  if ($rootScope.userData != undefined) {
      $ionicLoading.show({
          template: 'loading'
      })
      $http.get('http://api.getchill.co/api/v1/messages/index/id_user/'+$rootScope.userData.id_user+'/id_contact/'+$stateParams.id)
      .success(function(data) {
          $scope.messages = data;
          angular.forEach($scope.messages.response, function(response, i){
              if (response.type == 'location') {
                  var strings = response.content.split(' ');
                  var lat1 = strings[0], lat2 = strings[1];
                  $http.get('http://maps.googleapis.com/maps/api/geocode/json?latlng='+lat1+','+lat2+'&sensor=false')
                  .success(function(data) {
                      $ionicLoading.hide();
                      response.address = data.results[0].formatted_address;
                  });
              };
          });
          $ionicSlideBoxDelegate.update();
      });
  }
  else
  {
      $location.path('/login');
  };
});

An array of objects can not be seen in the method. (angularjs)

1 Answers1