Angular.js 将数据从异步服务传递到作用域 [英] Angular.js pass data from async service to scope

问题描述

我有这样的服务

app.factory('geolocation', function ($rootScope, cordovaReady) {
    return {
        getCurrentPosition: cordovaReady(function (onSuccess, onError, options) {

            navigator.geolocation.getCurrentPosition(function () {
                var that = this,
                    args = arguments;

                if (onSuccess) {
                    $rootScope.$apply(function () {
                        onSuccess.apply(that, args);
                    });
                }
            }, function () {
                var that = this,
                    args = arguments;
                if (onError) {
                    $rootScope.$apply(function () {
                        onError.apply(that, args);
                    });
                }
            }, options);
        }),
        getCurrentCity: function (onSuccess, onError) {
            this.getCurrentPosition(function (position) {
                var geocoder = new google.maps.Geocoder();
                geocoder.geocode(options,function (results, status) {
                    var city = address_component.long_name;
                });
            });
        }
    }
});

我想从控制器做类似的事情

And I want to do from a controller something like

function MainCtrl($scope, geolocation) {
   geolocation.getCurrentCity(function(city){
       $scope.city = city;
   });
};

getCurrentPosition 工作正常，城市也已确定，但我不知道如何在控制器中访问城市.

The getCurrentPosition works fine and the city is determined too, however I don't know how to access the city in controller.

会发生什么?当调用 getCurrentCity 时，它会调用 getCurrentPosition 来确定 gps 坐标.这个坐标作为参数传递给 onSuccess 方法对吗?所以这与我想在 getCurrentCity 方法中做的完全一样，但我不知道如何做.异步地理编码器检索了城市，我想将新数据应用于 onSuccess 方法.

What happens? When getCurrentCity is called, it calles getCurrentPosition to determine the gps coords. This coords are passed as arguments to the onSuccess method right? So this is quite the same I want to do in the getCurrentCity method, but I don't know how. Ones the async geocoder retrieved the city, I want to apply the new data to the onSuccess method.

有什么想法吗?

推荐答案

您正在处理回调和异步请求.所以你应该使用 $q 服务.只需使用 $rootScope 和 cordovaReady 依赖项将其注入到您的服务中即可.并像这样将承诺添加到您的功能中

You are dealing with callbacks and asynchronous request. So you should use $q service. Just inject it in your service with $rootScope and cordovaReady dependency. And add the promises to your function like this

getCurrentCity: function () {
    var deferred = $q.defer(); 
    this.getCurrentPosition(function (position) {
      var geocoder = new google.maps.Geocoder();
      geocoder.geocode(options,function (results, status) {
        var city = address_component.long_name;
        $rootScope.$apply(function(){
          deferred.resolve(city);
        });
      });
    });
    return deferred.promise;
}

在您的控制器中，执行以下操作来处理承诺.

And in your controller, do the following to handle the promise.

function MainCtrl($scope, geolocation) {
   geolocation.getCurrentCity().then(function(result) {  //result === city
     $scope.city = result;
     //do whatever you want. This will be executed once city value is available
   });     
};

这篇关于Angular.js 将数据从异步服务传递到作用域的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！