CODEWITHSUNDEEP
javascriptarraysfirebasefirebase-realtime-database
David Schober
David Schober

Reputation: 15

Converting Firebase object(s) to an array

I have a working code to read the data from the Firebase. Now I would like to convert the objects in arrays. I found a lot, but unfortunately nothing works for me. I hope someone has an idea and can help me. I would be very grateful for any help.

  firebase.database().ref("/Verrechnung/Messner").orderByChild("Time").on('value', function(snapshot){
  let elm = document.getElementById("data");
  elm.innerHTML = '';

  snapshot.forEach(function(childSnapshot){
    var childKey = childSnapshot.key;
    var childData = childSnapshot.val();
    elm.innerHTML += JSON.stringify(childData.Time)
    + JSON.stringify(childData.Kennzeichen)
    + JSON.stringify(childData.Adresse) 
    + JSON.stringify(childData.Provision);
  })
})
    getData();

Firebase

Output

 "Verrechnung" : {
        "Messner" : {
          "-Lq5fgQFGiM1OPr-vQPP" : {
            "Adresse" : "Teschnergasse 31, 1180 Wien, Österreich",
            "Kennzeichen" : "W-7637TX",
            "Provision" : "€ 1,50",
            "Time" : "20191001113751"
          },
          "-Lq6389RYSY9LPOsjr7a" : {
            "Adresse" : "Eisteichstraße, 1110 Wien, Österreich",
            "Kennzeichen" : "W-7637TX",
            "Provision" : "€ 1,50",
            "Time" : "20191001132440"
          },
          "-LqAAhgUWJs_8_AQvqX1" : {
            "Adresse" : "Gentzgasse 123, 1180 Wien, Österreich",
            "Kennzeichen" : "W-7637TX",
            "Provision" : "€ 1,50",
            "Time" : "20191002083619"
          },
          "-LqAwfg5WSYeBG8yGoIV" : {
            "Adresse" : "Raffelspergergasse, 1190 Wien, Österreich",
            "Kennzeichen" : "W-7637TX",
            "Provision" : "€ 1,50",
            "Time" : "20191002121014"
          },
          "-LqFtZJBS_-LCbsENi2a" : {
            "Adresse" : "Landwehrstraße 6, 1110 Wien, Österreich",
            "Kennzeichen" : "W-7637TX",
            "Provision" : "€ 1,50",
            "Time" : "20191003111445"
          },
        },

Upvotes: 0

Views: 1543

Answers (1)

robsiemb
robsiemb

Reputation: 6354

Thanks for the answers in the comment thread.

This seems to do roughly the right thing for me:

let elm = document.getElementById("data");

firebase.database().ref("/Verrechnung/Messner").orderByChild("original").on('value', (snapshot) => {
  let dataArray = {};
  snapshot.forEach((childSnapshot) => {
    dataArray[childSnapshot.key] = childSnapshot.val();
    console.log(childSnapshot.key);
  });
  elm.innerHTML = JSON.stringify(dataArray);
});

This doesn't give exactly the output you are looking for -- it only gives the innermost array. If you want to wrap this in dictionaries based on the collection name (as in your example) it would look slightly different.

Obviously I'm just injecting the array as JSON back into the document, you should do whatever is the correct thing that you need.

Likewise, its totally ok to declare dataArray outside of the callback too if you need access to it.

You might be able to use once instead of on. See here. Alternatively, if you do want this to be constantly updated, using 'value' may not be the most efficient listen mode.

Upvotes: 1

Related Questions