служба возвращает undefined в массиве в angularjs

У меня проблемы с моим скриптом angularjs.

Фон: я пытаюсь определить местоположение пользователя, я написал свою бизнес-логику в своем сервисе, откуда я возвращаю местоположение пользователя.

Проблема: результат, который я получаю в своей консоли, выглядит следующим образом:

[не определено] LandingPage.js: 11 не определено LandingPage.js: 11 не определено

var app = angular.module("PublicEvents", ["geolocation"]);

app.controller("iterator", ["$scope", "$http", "locationService1", function($scope, $http, locationService1){
    $scope.targetCity = [];
    $scope.targetCity.push(locationService1.location());

    console.log($scope.targetCity);
    $scope.$watch(function () { return locationService1.cityNameArray; },
            function (value) {
        $scope.targetCity = value;
        console.log($scope.targerCity);
    }
    );

}]);



app.service("locationService1",['$http','$window', function( $http, $window){
    var access = this;
    this.location = function(){
        $window.navigator.geolocation.getCurrentPosition(function(position) {
            access.lat = position.coords.latitude;
            access.long = position.coords.longitude;

            access.locationData = [];
            access.cityNameArray = [];

            /*var url = "http://maps.googleapis.com/maps/api/geocode/json?latlng=18.9750,72.8258&sensor=true";*/
            var url = "http://maps.googleapis.com/maps/api/geocode/json?latlng="+access.lat+","+access.long+"&sensor=true";

            //AJAX CALL TO GET THE LOCATION
            $http.get(url).then(function(response) {
                access.locationData = response.data; 
                if(access.locationData.status == "OK" || access.locationData.status==200 ) {
                    angular.forEach(access.locationData.results, function(value, key){
                        var len = value.address_components.length;
                        for(var i = 0; i< len; i++){
                            if(value.address_components[i].types[0] =="locality" || value.address_components[i].types[0] =="sublocality_level_1"){
                                access.cityNameArray.push(value.address_components[i].long_name);
                            }
                        }
                    }); 
                };
            }); 
            return access.cityNameArray;
        });
    };
}]);

javascript angularjs angular-promise angularjs-service angularjs-factory
person Pragam Shrivastava    schedule 25.09.2015    source источник
comment
что такое строка 11 в файле LandingPage.js?   -  person toskv    schedule 25.09.2015
comment
console.log($scope.targerCity); внутри $ смотреть   -  person Pragam Shrivastava    schedule 25.09.2015
comment
Я думаю, что тогда это может быть дубликат этого вопроса: .com/questions/25575963/   -  person toskv    schedule 25.09.2015
comment
angular запустит наблюдателя один раз, когда вы его создадите, и поскольку с сервера ничего не было возвращено, ваше значение не определено. Ответ Панкая тоже кажется довольно хорошим. :)   -  person toskv    schedule 25.09.2015
comment
Позвольте мне проверить ссылку, которую вы дали....   -  person Pragam Shrivastava    schedule 25.09.2015

Ответы (1)


arrow_upward
2
arrow_downward

Похоже, вам нужно вернуть данные из асинхронного вызова, и вы возвращаете значение из-за пределов функции. Я бы предложил вам использовать шаблон обещания в такой ситуации.

this.location = function(){
    $window.navigator.geolocation.getCurrentPosition(function(position) {
        access.lat = position.coords.latitude;
        access.long = position.coords.longitude;

        access.locationData = [];
        access.cityNameArray = [];

        /*var url = "http://maps.googleapis.com/maps/api/geocode/json?latlng=18.9750,72.8258&sensor=true";*/
        var url = "http://maps.googleapis.com/maps/api/geocode/json?latlng="+access.lat+","+access.long+"&sensor=true";

        //return promise from here..
        return $http.get(url).then(function(response) {
            access.locationData = response.data; 
            if(access.locationData.status == "OK" || access.locationData.status==200 ) {
                angular.forEach(access.locationData.results, function(value, key){
                    var len = value.address_components.length;
                    for(var i = 0; i< len; i++){
                        if(value.address_components[i].types[0] =="locality" || value.address_components[i].types[0] =="sublocality_level_1"){
                            access.cityNameArray.push(value.address_components[i].long_name);
                        }
                    }
                }); 
            };
            return access.cityNameArray; //returned from success callback
        }); 

    });
};

Внутри контроллера вам нужно использовать функцию .then для получения данных из функции службы loacation. Вы делали console.log, когда выполняете асинхронный вызов, который ничего не возвращает.

locationService1.location().then(function(data){ //success callback.
   $scope.targetCity.push(data)
},function(error){ //error callback.
   console.log(error)
});
person Pankaj Parkar    schedule 25.09.2015
comment
Я не вижу никаких обещаний, возвращаемых функцией определения местоположения. - person toskv; 25.09.2015
comment
@toskv Спасибо за внимание .. Я редактирую свой ответ .. TYSM - person Pankaj Parkar; 25.09.2015
comment
Требуется ли возвращать access.cityNameArray и обещание... На самом деле я получаю сообщение об ошибке, не могу прочитать свойство "тогда" неопределенного - person Pragam Shrivastava; 25.09.2015
comment
@PragamShrivastava да, вам нужно вернуть как return $http.get(url)., так и access.cityNameArray - person Pankaj Parkar; 25.09.2015
comment
Это сработало после того, как я отделил функцию навигатора! Спасибо :) - person Pragam Shrivastava; 28.09.2015