Создать HTML-таблицу с данными Firebase

Question

У меня настроена база данных firebase, и мне нужно создать таблицу HTML с этой необходимой информацией.Ниже описано, как я настроил свои данные Firebase.

{
  "Markets" : {
    "Athens" : {
      "Item" : {
        "name" : "Beef",
        "price" : 10,
        "salePrice" : 3
      }
    }
  }
}

Вот как я настроил свою таблицу HTML и мой код, чтобы попытаться получить данные.Таблица создается соответствующим образом, но я не вижу никаких данных.Любая помощь будет принята с благодарностью.

<table style="width:100%" id="ex-table">
  <tr id="tr">
    <th>Name:</th>
    <th>Price:</th> 
    <th>Sale Price:</th>

 </table> 

<script>
    var database = firebase.database();
    database.ref().once('value', function(snapshot){
        if(snapshot.exists()){
            var content = '';
            snapshot.forEach(function(data){
                var val = data.val();
                content +='<tr>';
                content += '<td>' + val.name + '</td>';
                content += '<td>' + val.price + '</td>';
                content += '<td>' + val.salePrice + '</td>';

                content += '</tr>';
            });
            $('#ex-table').append(content);
        }
    });
</script>

Answer 1

Прямо сейчас вы читаете корневой узел. В вашем JSON есть еще несколько уровней данных, прежде чем вы перейдете к свойствам name, price и salesPrice. Вам нужно будет перемещаться по этим уровням в вашем обратном вызове или в вашем запросе. Пример последнего:

var database = firebase.database();
database.ref('Markets/Athens').once('value', function(snapshot){
    if(snapshot.exists()){
        var content = '';
        snapshot.forEach(function(data){
            var val = data.val();
            content +='<tr>';
            content += '<td>' + val.name + '</td>';
            content += '<td>' + val.price + '</td>';
            content += '<td>' + val.salePrice + '</td>';

            content += '</tr>';
        });
        $('#ex-table').append(content);
    }
});