將數據從異步調用存儲到AngularJS中的變量

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和array2的一些數據。

我正在嘗試做的更具體的案例，但是發現使用了promise-

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;
    });

});

根據第一個調用的結果將所有promise映射到一個promise數組。 在此地圖函數內部創建一個新的promise，並在成功函數中解決它。 確保您返回實際的承諾！

之后，您可以使用$q.all(promises)獲得所有已解析的數據。 這樣，您對數據庫的調用不限於2。您可以根據第一次調用中檢索到的數據進行任意數量的調用。

柱塞

編輯 ：不確定是否可以修改服務，但是最好只用一個電話就可以實現。 例如：

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);
   });
});