$ firebaseObject中的Angular.Foreach

时间:2016-10-24 10:09:24

标签: angularjs firebase firebase-realtime-database angularfire

我有一个服务Firebase,用于检索数据,并构建一个数组。我做了angular.foreach并将值放在一个实例化为零的表中。

但是它返回一个空数组。

我希望它能返回一系列对象标记。

这是我的服务。

(function () {

  'use strict';

   angular

    .module('app.pages.cartographie')

    .factory('DeviceService', DeviceService);

/* @ngInject */

function DeviceService($injector, $q) {
   // inject another service
    var ServiceUser = $injector.get('ServiceUser');
    var userDatas = ServiceUser.getUserDatas();
    console.log('info ' + userDatas.info);
    var service = {
        getMarkers: getMarkers
    };
    return service;

    function getMarkers() {
        // firebase Promise
        userDatas.$loaded().then(function () {
            var defer = $q.defer();
            var devices = userDatas.ownDevices;
            console.log('Device ' + devices);
            var markers = [];
            angular.forEach(devices, function (key) {
                var devicesData = firebase.database().ref().child('device/' + key).once('value');
                devicesData.then(function (data) {
                    var deviceObj = data.val();
                    markers.push({
                        lat: deviceObj.lat,
                        lng: deviceObj.lng
                    });
                });
            });
            $q.all(markers).then(function () {
                // 
                console.log('markers ' + JSON.stringify(markers));
            });
            return defer;
        });
    }
}})(); 

由于

1 个答案:

答案 0 :(得分:0)

代码markers.push()将在您致电$q.all(markers)后很长时间内发生,因此当您致电markers时,$q.all(markers)将为空。

我认为你应该能够像这样解决这个问题:

function getMarkers() {
    // firebase Promise
    return userDatas.$loaded().then(function () {
        var devices = userDatas.ownDevices;
        console.log('Device ' + devices);

        var markers = devices.map(function (key) {
            var devicesData = firebase.database().ref().child('device/' + key).once('value');

            return devicesData.then(function (data) {
                var deviceObj = data.val();

                return {
                    lat: deviceObj.lat,
                    lng: deviceObj.lng
                };
            });
        });

        return $q.all(markers)
            // the next three lines are not necessary and are just for debugging
            .finally(function (retrievedMarkers) {
                console.log('markers ' + JSON.stringify(retrievedMarkers));
            });
    });
}

我还建议重构这个,这样你就不会在一个函数中做太多:

// returns a promise for one set of coordinates
function getDeviceCoordinates(deviceKey) {
    var devicesData = firebase.database().ref().child('device/' + key).once('value');

    return devicesData.then(function (data) {
        var deviceObj = data.val();

        return {
            lat: deviceObj.lat,
            lng: deviceObj.lng
        };
    });
}

function getMarkers() {
    // firebase Promise
    return userDatas.$loaded().then(function () {
        var devices = userDatas.ownDevices;
        console.log('Device ' + devices);

        var markers = devices.map(getDeviceCoordinates);

        return $q.all(markers)
            // the next three lines are not necessary and are just for debugging
            .finally(function (retrievedMarkers) {
                console.log('markers ' + JSON.stringify(retrievedMarkers));
            });
    });
}