无法使用Phonegap显示Firebase数据

Question

空html表图像 我在使用phonegap检索Firebase数据时遇到问题，即使从Firebase数据库中填充了数据，我的html表仍显示空值

这是我的Firebase数据

 [ null, {
 "CompleteAddress" : "District 5, Manuel Vega St. Sta Cruz, Consolacion 
 Cagayn de Oro City",
 "Contactnumber" : "09355547859",
 "Firstname" : "Jhon Mark",
 "Lastname" : "Cantila",
 "Middle Name" : "Ferrolino"
 } ]

这是我的html代码

<div class="box box-success">
    <div class="box-header">
      <h3>  </h3> 
          <table class="table table-bordered table-striped">
            <thead>
            <tr>
                <th>Address</th>
                <th>Contact number</th>
                <th>First name</th>
                <th>Last name</th>
            </tr>
            </thead>
            <tbody id="example">

            </tbody>
        </table>
    </div>
  </div>

这是我的JavaScript代码

$(document).ready(function() {
var brandsRef = firebase.database().ref().child("consumer/1/");
brandsRef.on("child_added", snap=> {
   // var pic = snap.child("pic").val(); //This is the image src
    var CompleteAddress = snap.child("CompleteAddress").val();
    var Contactnumber = snap.child("Contactnumber").val();
    var Firstname = snap.child("Firstname").val();
    var Lastname =snap.child("Lastname").val();
    //var total =snap.child("total").val();

console.log(snap.val());
    var $row = $('<tr></tr>').appendTo('#example');
    //$('<td></td>').appendTo($row).append($('<img />').attr('src', pic));
    $('<td></td>').appendTo($row).text(CompleteAddress);
    $('<td></td>').appendTo($row).text(Contactnumber);
    $('<td></td>').appendTo($row).text(Firstname);
    $('<td></td>').appendTo($row).text(Lastname);
   // $('<td></td>').appendTo($row).text(total);
 //   $('<td><a class="label label-primary" 
href="view_product_orders.html">View</button></td>').appendTo($row);
     })

});