AngularJS Promises，$ q，延迟

Question

编辑

第一个答案是一个很好的答案，但是，正如该问题和另一个关于stackoverflow的问题中多次提到的那样，问题是服务和控制器在数据实际到达之前就运行它们的东西。

（对第一个答案的最后评论：）

是的，问题在于服务运行后API调用完成，并将所有内容返回给控制器，请参阅此处screencast.com/t/uRKMZ1IgGpb7
…这是我的BASE问题，如何在所有部件上等待数据发送到到达？

这就像我重复说的那样， 在成功完成数据检索之后，我们如何提供服务来填充数组，而在发生所有这些情况后，控制器将获取数据
，因为正如您在我的屏幕快照中所看到的，事情在另一个地方运行订购。

我有以下代码：

 var deferred = $q.defer();
            $http.get('../wordpress/api/core/get_category_posts/?category_id=14 ').success(function(data) {
                //we're emptying the array on every call
                theData = [];
                catName = data.category.slug;
                theData = data;
                theData.name = catName;
                aggregatedData.push(theData);
            });
            $http.get('../wordpress/api/core/get_category_posts/?category_id=15 ').success(function(data) {
                theData = [];
                catName = data.category.slug;
                theData = data;
                theData.name = catName;
                aggregatedData.push(theData);
            });
            $http.get('../wordpress/api/core/get_category_posts/?category_id=16 ').success(function(data) {
                theData = [];
                catName = data.category.slug;
                theData = data;
                theData.name = catName;
                aggregatedData.push(theData);
            });
            $http.get('../wordpress/api/core/get_category_posts/?category_id=17 ').success(function(data) {
                theData = [];
                catName = data.category.slug;
                theData = data;
                theData.name = catName;
                aggregatedData.push(theData);
            });
            //deferred.resolve(aggregatedData);
            $timeout(function() {
                deferred.resolve(aggregatedData);
            }, 1000);
            /*//deferred.reject('There is a connection problem.');
            if (myservice._initialized) {
                $rootScope.$broadcast('postsList', deferred.promise);
            }*/
            //myservice._initialized = true;
            myservice = deferred.promise;
            return deferred.promise;

对于我的一生，我无法理解为什么在传递结果数组以进行延迟时必须设置超时？

原则不应该是，延迟等待信息到来然后返回承诺吗？那那一秒钟的意义是什么？据我了解，defer应该能够等待API返回结果并返回承诺数据的时间。

我真的很困惑，在过去的两个小时里，我一直把头撞在墙上，因为我没有在控制器中收到任何数据，只有当我将超时时间放在那儿时。

Answer 1

恕我直言，我认为有很多聪明（优雅）的方法可以做到这一点$q.all。

请看下面的代码。

我假设您想一次返回数据，并将所有结果汇总在一个大数组上。

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

myApp.factory('myService', function ($http, $q) {
    return {
        getAllData: function () {
            return $q.all([
                $http.get('../wordpress/api/core/get_category_posts/?category_id=14'),
                $http.get('../wordpress/api/core/get_category_posts/?category_id=15'),
                $http.get('../wordpress/api/core/get_category_posts/?category_id=16'),
                $http.get('../wordpress/api/core/get_category_posts/?category_id=17')
            ]).then(function (results) {
                var aggregatedData = [];
                angular.forEach(results, function (result) {
                    aggregatedData = aggregatedData.concat(result.data);
                });
                return aggregatedData;
            });
        }
    };
});

您可以在上方看到aggregatedData只有通过完成所有异步调用后，才会生成$q.all。

例如，您只需要将该服务作为依赖项包含到您的一个控制器中，然后像这样调用该服务 myService.getAllData()

希望对您有所帮助，或者让我知道您是否需要一个完整的示例，我可以提供一个示例！:)