Question

这可能是一个初学者的问题，但为什么$ scope.usercountry变量保持不变，虽然服务成功了？

var myApp = angular.module('myApp', []);

myApp.factory('myService', function ($http) {
return {

    userCountry: function () {
        $http.get("http://ipinfo.io/json").success(function (data) {
            var userCountry = data.country;
            alert(userCountry);
            return userCountry;
        });

    }

  };

});

function MyCtrl($scope, myService) {
$scope.usercountry = myService.userCountry();
}

Answer 1

$ http以异步方式工作，这意味着当您调用服务 userCountry 时，将对终点进行异步调用，代码将返回到调用函数。所以基本上你试图在实际获取之前显示数据。这是使用promises时的基本行为。

为了解决这个问题，你需要从服务和调用函数返回一个promise，你应该等到数据从http请求返回。

你可以阅读这个here。更新小提琴：http://jsfiddle.net/9twyLna1/3/

var myApp = angular.module('myApp', []);
myApp.factory('myService', function ($http) {
    return {

        userCountry: function () {
            return $http.get("http://ipinfo.io/json");
        }

    };

});

function MyCtrl($scope, myService) {
    $scope.usercountry = myService.userCountry().then(function(data){
      return data.data.country;        
    });
}

范围变量调用http服务保持未定义

1 个答案: