javascript - AngularJS Promises, $ q, diferir

Question

EDITAR

La primera respuesta es la más elegante, pero, como se dijo varias veces en esta pregunta y en otras preguntas sobre el stackoverflow, el problema es que el servicio y el controlador funcionan antes de que los datos lleguen.

(Último comentario en la primera respuesta :)

Sí, el problema es que las llamadas API terminan DESPUÉS de que se ejecute el servicio y lo devuelve todo al controlador, mira aquí screencast.com/t/uRKMZ1IgGpb7 ... Esa es mi pregunta BASE, ¿cómo podría esperar todas las partes de los datos para ¿llegar?

Es como si lo dijera repetidamente, cómo hacemos un servicio que rellena la matriz después de la recuperación exitosa de datos, y el controlador obtiene datos después de que todo esto sucede , porque como puede ver en mi captura de pantalla, las cosas se ejecutan de manera diferente. orden.

Tengo este código:

 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;

Por mi vida, no puedo entender por qué tengo que poner un tiempo de espera al pasar la matriz resultante para diferir?

¿No debería ser el principio, el aplazamiento espera a que llegue la información y luego devuelve la promesa? ¿Cuál es el punto de ese 1 segundo allí? Por lo que entiendo, el aplazamiento debería poder esperar tanto como sea necesario para que la API devuelva el resultado y devuelva los datos prometidos.

Estoy realmente confundido, me golpeé la cabeza contra las paredes durante las últimas dos horas porque no estaba recibiendo datos en mi controlador, solo cuando puse ese tiempo de espera allí.

Answer 1

En mi humilde opinión, creo que hay una manera muy inteligente (y elegante) de hacer esto con $q.all .

Por favor, eche un vistazo al código a continuación.

Supongo que desea devolver los datos a la vez con todos los resultados agregados en una gran matriz.

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

Puede ver arriba que aggregatedData solo se genera una vez que todas las llamadas asincrónicas se completan a través de $q.all .

Solo necesita incluir el servicio como dependencia en uno de sus controladores, por ejemplo, y llamar al servicio de esta manera myService.getAllData()

Espero que ayude o solo avíseme si necesita un ejemplo completo de trabajo y puedo proporcionar uno. :)

Answer 2

Las llamadas $http.get son asincrónicas, pero no espera hasta que estén completas antes de resolver el diferido. Aquí funciona con el tiempo de espera simplemente porque tiene suerte de que las llamadas tengan tiempo para completarse en 1 segundo, sin embargo, esto no es confiable en absoluto.

No voy a reiterar una solución completa aquí, pero eche un vistazo a mi respuesta para otro problema similar.