javascript - 如何让Javascript在继续之前等待异步调用？

Question

我有一个工厂去服务器获取一些参考数据。

通过的问题是下面的http get调用是异步的，所以一旦调用它就转到下一行。因此，使用下面的代码，它会将数据返回为 null，因为当 http 调用完成并且我的回调开始复制到数据变量时，它已经退出了该方法。

如何让它等到回调函数运行后再继续下一行？

顺便说一下，我在这里使用 Angular。

app.factory('referenceDataFactory', ['$http', function ($http) {
    var factory = [];

    factory.getSports = function () {

        var data;
        $http.get('/Home/GetSports').success(
            function (obj) {
                data = obj;
            });

        return data;    


        // return [{ id: 1, name: 'Volleyball' }, { id: 2, name: 'Football' }, { id: 3, name: 'Tennis' }, { id: 4, name: 'Badminton' }];
    }


    return factory;

}]);

Answer 1

AngularJs 中的 http API 将返回一个promise。您应该返回整个承诺，并且您是否在调用“getSports”的函数中的“成功”回调中编写代码。

这是一个例子。

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

app.factory('referenceDataFactory', ['$http', function ($http) {
    var factory = [];
    factory.getSports = function () {
        return $http.get('/echo/js/?delay=6&js="test"')
    }

    return factory;
}]);

function HelloCtrl($scope, referenceDataFactory) {
    referenceDataFactory.getSports().success(function (result) {
        $scope.fromFactory = result;
    });
};