1

我目前无法从 Firebase 实时数据库中检索数据，并希望在 HTML 表中显示它。我想寻求一些帮助，我目前有一个关于后端的项目/任务。我决定在我的 Web 应用程序中使用 Firebase 作为数据库。我现在可以将数据发送到数据库，但我有一个问题，我无法将数据从 Firebase 检索到 Web 应用程序。我打算检索数据并将其显示在我的表格 (HTML) 中。

  $(document).ready(function () {



        var config = {

            authDomain: "digital-student-diary.firebaseapp.com",
            databaseURL: "https://digital-student-diary.firebaseio.com",
            projectId: "digital-student-diary",
            storageBucket: "",
            messagingSenderId: "573866105673"
        };
        firebase.initializeApp(config);

        const database = firebase.database();
        const databaseReference = database.ref().child('school/teacher');

        databaseReference.on('child_added', snap => {
            JSON.stringify(snap.val());


            var name = snap.child('teacherName').val();
            var email = snap.child('teacherEmail').val();
            var dob = snap.child('teacherDateofBirth').val();
            var phone = snap.child('teacherPhone').val();
            var cnic = snap.child('teacherCnic').val();
            var city = snap.child('teacherCity').val();
            var street = snap.child('teacherStreetAddress').val();
            var gender = snap.child('teacherGender').val();



            var tableRef = document.getElementById('tableBody');

            tableRef.append('<tr><td>' + name + '</td><td>' + email + '</td><td>' + dob + '</td><td>' + phone + '</td><td>' + cnic +
                '</td><td>' + city + '</td><td>' + street + '</td><td>' + gender + '</td></tr>');
        });




    });

view-teacher.html

这是我的视图教师文件，带有一个基本的 HTML 表格，表格主体的 ID 为“tableBody”，我用于引用表格。

<div class="content mt-3">
    <div class="animated fadeIn">
        <div class="row">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-header">
                        <strong class="card-title">List of Teachers</strong>
                    </div>
                    <div></div class="card-body">
                    <table class="table">
                        <thead class="thead-dark">
                            <tr>
                                <th>Name</th>
                                <th>email</th>
                                <th>DOB</th>
                                <th>Phone</th>
                                <th>CNIC</th>
                                <th>City</th>
                                <th>Street</th>
                                <th>Gender</th>

                            </tr>
                        </thead>

                        <tbody id="tableBody">

                        </tbody>
                    </table>

                </div>
            </div>
        </div>
    </div>
</div><!-- .animated -->
</div><!-- .content -->

这是我的代码的输出

输出

4

1 回答 1

0

you don't need the 

<script>

tag in the table body. screenshot if the page structure in web tools would be more helpful to diagnose the problem. the structure seems right.

于 2018-12-18T20:29:13.100 回答