从Firebase数据库中检索数据

我对Firebase完全陌生，我已将数据保存在Firebase数据库中，但我无法检索它并显示在表格中。我的代码如下。任何帮助将不胜感激。从Firebase数据库中检索数据

这里是火力数据库的图像：

Firebase DB

的Javascript：

/*jslint plusplus: true*/ 
var rootRef = firebase.database().ref().child("users"); 

rootRef.on("child_added", snap => { 

var medname = snap.child("MedName").val(); 
var end = snap.child("End").val(); 
var start = snap.child("Start").val(); 
var type = snap.child("Type").val(); 
var Description = snap.child("description").val(); 

$("demo").append("<tr><td>" + medname + "</td><td>" + end + 
         "</td><td>" + start + "</td><td>" + type + 
         "</td><td>" + Description + 
         "</td><td><button>Remove</button></td></tr>"); 


}

HTML：

<!-------------------------------------- Table --------------------------------------------> 
     <table> 
      <thead> 
       <tr> 
        <td>MedName</td> 
        <td>End</td> 
        <td>Start</td> 
        <td>Type</td> 
        <td>Description</td> 
       </tr> 
      </thead> 
      <tbody id=demo> 

      </tbody> 
    </table>

来源

2017-01-11 Cutie Pie

是回调正被触发的呢？您的JavaScript控制台中是否显示任何消息？ –

我没有收到任何这样的消息，数据根本不显示，更不用说显示在表中。 –

您是否尝试在调试器中进入回调？堆栈溢出是一个臭名昭着的低效调试工具，所以如果你自己做这些步骤并告诉我们，它确实有帮助。或者：你可以在jsbin中重现问题，所以我们可以在那里看看它吗？ –

第一所有更正脚本中的错误。在jquery中写入#demo而不是demo。希望这会完全帮助你

来源

2017-02-14 05:01:47 Rahul

如果你删除了两个重大错误，你的代码将工作。

不使用前面答案中提到的正确选择器。 $（'＃demo'）或$（'。demo'）将在您使用ID或类选择器时起作用。
不要创建一个名为'end'的变量。 End是Javascript中的保留字。

不过，在这里是不使用变量重写：

var rootRef = firebase.database().ref().child('users'); 

rootRef.on("child_added", function (userRecord) { 

    var user = userRecord.val(); 
    var row = $('<tr></tr>'); 

    row.append('<td>' + user.MedName + '</td>'); 
    row.append('<td>' + user.Start + '</td>'); 
    row.append('<td>' + user.Type + '</td>'); 
    row.append('<td>' + user.description + '</td>'); 
    row.append('<td><button>Remove</button></td>'); 

    $('#demo').append(row); 

});

而且目前还不清楚是否打算使用ES2015或ES5。这可能会导致兼容性问题，具体取决于代码的运行位置，但不要混淆它们。

这里是我见过的最好的Javascript风格指南：

AirBnB ES5 Style Guide

AirBnB ES2015 Style Guide

来源

2017-03-02 05:09:40 deezy