AngularJS-从$ http.get循环返回promise

Question

我正在分页的端点上发出GET请求，因此，我正在打一个电话，找出该端点有多少页，然后遍历每一页，将来自每一页的响应数据推入一个数组中。

但是，由于调用是如此之大，因此当从控制器中获取工厂数据时，我需要在函数中设置超时时间，以确保所有数据在使用前都已输入。

我希望将其切换到工厂中的一个承诺，即控制器将等待直到请求完成。 但是，由于我要遍历每个页面，因此通常无法构造该页面。 我该如何重做以使promise等待端点页面上的完整循环，以便可以从控制器中删除超时？

工厂API GET请求

var productsData = [];
var pageNumber = 1;
var getAllProducts = function(){
    var deferred = $q.defer();
    return $http.get('/api/scroll?page=' + pageNumber,{cache: true})
        .then(function(response) {
            for (var i = response.data.results.length - 1; i >= 0; i--) {
                productsData.push(response.data.results[i]);
            };
            while (pageNumber <= response.data.pages) {
                getAllProducts();
                pageNumber++;
            }
            deferred.resolve(productsData)
            return deferred.promise;
        });
};

控制器功能

    var filterProducts;
    var getProducts = function(type, filter) {
        productFactory.getAllProducts()
        .then(function(products) {
            $timeout( function(){
                var allProducts = products;
                switch (type) {
                    case "category":
                        filterProducts = $filter('filter')(allProducts, {
                            custom: {category_code: filter}
                        });
                        break;
                    case "color":
                        filterProducts = $filter('filter')(allProducts, {
                            custom: {color_code: filter}
                        });
                        break;
                    case "season":
                        filterProducts = $filter('filter')(allProducts, {
                            custom: {season: filter}
                        });
                        break;
                    default:
                        filterProducts = allProducts;
                }
                $rootScope.products = _.sortBy(filterProducts, function(product) {
                    return product.custom.sku;
                });
            }, 1000);
        });
    };

Answer 1

您应该在GET调用函数之外创建一个延迟的对象，并仅在完成所有请求后才对其进行解析。 所以我认为它可以看起来像这样

 var productsData = []; var pageNumber = 1; var deferred; function getAllProducts() { deferred = $q.defer(); _getPageProducts(pageNumber); return deferred.promise; } function _getPageProducts(pageNumber) { $http.get('/api/scroll?page=' + pageNumber,{cache: true}) .then(function(response) { for (var i = response.data.results.length - 1; i >= 0; i--) { productsData.push(response.data.results[i]); }; if (pageNumber < response.data.pages) { pageNumber++; _getPageProducts(pageNumber); } else { deferred.resolve(productsData) ; } }); }