как взять данные из хранилища огня и добавить их в мой HTML - PullRequest
Новая
       29

как взять данные из хранилища огня и добавить их в мой HTML

0 голосов
/ 18 мая 2019

так что в основном я новичок в anqular7 и у меня есть база данных и сбор из «пользователей» и хотел бы перемещаться по этим пользователям, у меня есть более одного пользователя и взять имя поля и отобразить его в определенном месте в моем HTML

Я пытаюсь использовать jquery и добавить его в ('p'). Appendchild ('li'), но он дал мне только имя первого в моей коллекции, где в console.log (doc.data (). FullName). ); это показывает мне, что оно проходит через всех пользователей

это где перейти к моей базе данных 

snapshot.docs.forEach(doc=>{
  this.renderout(doc)

```}
 this is the function 

````renderout(doc) 
  {
    let li=document.createElement('li');
  let name=document.createElement('span');
      li.setAttribute('data-id',doc.id);
    //  console.log(doc.id);

    name.textContent=doc.data().fullName;
   // name.textContent+=doc.data().Email;
    this.Nametest=name.textContent;

    $('p').appendChild(li);  

  console.log(doc.data().fullName);

 ````` } 

this  is my html 
````<p id="user1">Some text.. 1 {{Nametest}}</p>
      <img src="https://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
    </div>
    <div class="col-sm-3"> 
      <p id="user2">Some text.. 2 {{Nametest}}</p>
      <img src="https://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
    </div>
    <div class="col-sm-3"> 
      <p>Some text.. 3 {{Nametest}}</p>
      <img src="https://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
    </div>
    <div class="col-sm-3"> 
        <p>Some text.. 4 {{Nametest}}</p>
        <img src="https://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
```      </div>



i expected to navigate throug the p and in each  the for each loop
finish  user1 will have name"test1"
         user2 will have name"test2"
       user3 will have name"test3"
inside the {{Nametest}}
...