Я не могу получить данные для моего DOM - PullRequest
0 голосов
/ 29 апреля 2020

У меня есть некоторые данные в моей базе данных облачного пожарного хранилища. Я пытаюсь получить данные и отобразить их на моей странице html, но это не позволяет мне получить сообщение консоли. Я уже в состоянии извлечь данные на мою домашнюю страницу с помощью функции setupProp, но когда я добавил функцию setupIndProp для передачи данных на мою под html страницу, она не работает. Примечание. Когда я удаляю функцию setupIndProp (data), она отображается на моей странице, но без каких-либо динамических данных c (только для тестирования), но когда я покидаю ее, как показано ниже, код исчезает. код ниже, где я получаю данные из базы данных:

// get data from the cloud Database
db.collection('properties').onSnapshot(snapshot => {
    setupProp(snapshot.docs);
    setupIndProp(snapshot.docs);  // added setupIndProp func in order to pass my data to my sub html page

});

, и это мой js файл для страницы sub html, где у меня возникает проблема при добавлении setupIndProp:

const allProperties = document.querySelector('.all-properties');
    const setupIndProp = data => {
        data.forEach(doc => {
            const info = doc.data();
            let html = `
            <div class="row">

                  <div class="col l6 s12 m12">
                      <div class="card" style="height: auto; border-radius: 5px; background-color: #f9f9f9; padding: 10px;">
                          <h5 class="center">${info.title}</h5><br><br>
                          <span style="font-weight: bold;">Price: ${info.price} &#36;</span><br><br>
                          <span><i class="material-icons blue-text">room</i> Located in ${info.city}</span><br><br>
                          <span><i class="material-icons blue-text">single_bed</i> Total Rooms ${info.rooms}.</span><br>
                      </div>
                  </div>


            </div>
            `;

            allProperties.innerHTML = html;
        })

    }

А вот моя страница под HTML, на которой ничего не отображается:

<div class="container all-properties" style="height: auto;">

    </div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...