Converting Firebase object(s) to an array

Question

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"
          },
        },

You need to provide additional detail in order to get an answer here -- for example, what does the data in your database look like, and how does that translate to what you would like an array of. — robsiemb
– robsiemb, Commented Oct 5, 2019 at 21:35
@robsiemb thanks, i edit the post. I would like to convert the objects into arrays so that I can process them further. — David Schober
– David Schober, Commented Oct 5, 2019 at 21:47
If you simply want to create an array from object have you tried Object.values(data)? Do you want to mutate each element shape? As @robsiemb points out, what is your input and expected output? — Drew Reese
– Drew Reese, Commented Oct 5, 2019 at 21:52
@davidschober That looks like its probably the output you currently are getting, not the output you want. Notably, you're not currently building an array, you're just appending to a string. — robsiemb
– robsiemb, Commented Oct 5, 2019 at 21:54
Yes that's the problem. I've already seen that go with console.log(array). So that I do not create a string. But that did not work. — David Schober
– David Schober, Commented Oct 5, 2019 at 21:59

robsiemb · Accepted Answer · 2019-10-05 23:34:35Z

1

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.

edited Oct 5, 2019 at 23:34

answered Oct 5, 2019 at 23:14

robsiemb

6,3747 gold badges34 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

robsiemb Over a year ago

Sorry for the large number of edits, this should be the correct version.

David Schober Over a year ago

Thanks man. I put the "let elm = document.getElementById("data");" over "let dataArray" and now it works. Not nicely structured, just in a row. But for my purposes it does not have to look nice. 1000 Thanks from me!

Collectives™ on Stack Overflow

Converting Firebase object(s) to an array

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related