Question

以下是我尝试使用promise将数据从异步调用保存到变量但不起作用的代码。我是新来的承诺，因为我在这些情况下有所帮助，但我无法申请，请告诉我这里我做错了什么 -

angular.module("app").controller("myCtrl", function($scope, $http, $q) {
    var deferred = $q.defer();

    var data = $http.get("/api/events").success(function(response){
    deferred.resolve(response);
    return deferred.promise;
    // ALSO tried return response;
    })
    console.log("DATA--");
    console.log(data);
});

编辑 -

我想点击两个 APIS -

1）从第一次API命中创建id数组。

2）循环到数组以获取基于id的第二个API。

3）连接数组1和数组2中的一些数据。

更具体的情况，我试图做但发现使用承诺 -

http://pastebin.com/ZEuRtKYW

Answer 1

当您在异步调用中获得响应时，将其存储在范围变量中。然后您可以在控制器内的任何位置访问该范围变量

 angular.module("app").controller("myCtrl", function($scope, $http) {
         $http.get("/api/events").success(function(response){
         $scope.response = response;     
        })

    });

Answer 2

我会这样做：

$http.get('data.json').success(function (result) {
    $scope.result = result;
}).then(function (data) {
    var result = data.data.key;

    var promises = result.map(function (val) {
        var deffered = $q.defer();

        $http({
            method: 'GET',
            url: 'data-' + val.id + '.json'
        })
        .success(function (x) {
            deffered.resolve(x);
        })
        .error(function () {
            deffered.reject();
        });

        return deffered.promise;
    });

    $q.all(promises).then(function (result) {
        $scope.resolvedData = result;
    });

});

根据第一次调用的结果将所有promises映射到promises数组。在此map函数内部创建一个新的promise并在success函数中解析它。确保你回复实际的承诺！

之后，您可以使用$q.all(promises)获取所有已解析的数据。这样，您对数据库的调用不仅限于2.您可以根据第一次调用中检索到的数据执行所需的调用。

Plunker

修改：不确定您是否能够修改服务，但如果只通过一次通话就能实现这一目标会更好。例如：

get '/api/events' --> returns just the events
get '/api/events?includeDetail=true' --> returns the events + the details of an event

Answer 3

我认为可以这样做：

angular.module("app").controller("myCtrl", function($scope, $http, $q) {

   var ids = [],
       q1 = $q.defer(), 
       q2 = $q.defer();
       d1 = $http.get("/api/events").success(function(data){
               q1.resolve(data);
               angular.forEach(data, function(id) {
                  ids.push(id); 
               });
            }).error(function(err){
                q1.reject("Ooops!!")
            });

   var promises = [];

   angular.forEach(ids, function(id) {
      var promise = $http.get("/api/events", {id:id})
                    .success(function(data){
                        q2.resolve(data);
                    }).error(function(err){
                        q2.reject("Ooops!!")
                    });
      promises.push(promise);
   });

   $q.all(promises)
     .then(function(values) {        
       console.log(values);
   });
});

将数据从异步调用存储到AngularJS中的变量

3 个答案: