получить базу данных FireBase JSON - PullRequest
Новая
       10

получить базу данных FireBase JSON

0 голосов
/ 22 января 2019

Я пытаюсь получить все данные в базе данных Firebase.Когда я использовал этот код <h1>{{ item | async | json }}</h1> в зависимости от документа объекта angularfire2, я получил список объектов ответа json в html 

{
  "type": "value",
  "payload": {
    "8D3sENaBcLaXoGNnh1MPuoyj5LP2": {
      "-LWl294Hs6YjkvJE5pqi": {
        "name": "ddd",
        "title": "dd"
      },
      "-LWlEonKLWfOttzirqp7": {
        "name": "sas",
        "title": "ass"
      },
      "-LWlGvn81Kes2A-1UcC2": {
        "name": "asa",
        "title": "asass"
      },
      "-LWlK92A7gaRkKVrZSFU": {
        "name": "ddd",
        "title": "ddd"
      },
      "-LWla1PYxsIFKhaCXvtu": {
        "name": "ff",
        "title": "fdsf"
      },
      "-LWpfRJP8VdwG927wyXS": {
        "name": "ali",
        "title": "ali"
      },
      "-LWph3ei12KTNyirdnZb": {
        "name": "ddddd",
        "title": "daD"
      }
    },
    "WUM2HBkGo8TFDeOjEqO1s3lCj1p1": {
      "-LWlHlhyS9m3ECS3wIdk": {
        "name": "qwqsasasa",
        "title": "as"
      },
      "-LWlHmXZAJdSPZurO7ii": {
        "name": "qwqsasasa",
        "title": "as"
      },
      "-LWph-fv4JMtTk22aE5X": {
        "name": "sssssssssssssssssssssssss",
        "title": "sssssssssssssssssssssssss"
      }
    }
  },
  "key": "report"
}

Я хочу получить из этого списка только объекты json title и name.Я использовал этот код, но у меня пустая страница в html нет данных для показа!

  <h1>{{ (item | async)?.name }}</h1>
  <h1>{{ (item | async)?.title }}</h1>

основной код 

  itemRef: AngularFireObject<any>;
  item: Observable<any>;

      ionViewWillLoad(){
        this.fire.authState.subscribe(data => {
          if(data && data.email && data.uid){
            this.toastCtrl.create({
              message : ` welcome ${data.email}`,
              duration:2000
            }).present()

            this.itemRef = this.db.object('report');
            this.item = this.itemRef.snapshotChanges();

          }

        })

      }

1 Ответ

0 голосов
/ 22 января 2019

Клавиша /report в вашей базе данных, кажется, содержит список объектов: в частности, список отчетов для каждого пользователя, поэтому с двумя вложенными ключами в /report. Но ваш код загружает его как один объект. Это приводит к тому, что этот HTML <h1>{{ (item | async)?.name }}</h1> по существу отображает /report/name, которого нет в вашей базе данных.

Если вы хотите отобразить название и заголовок отдельного отчета , вам необходимо знать ключи этого отчета. Например, чтобы показать первый отчет для первого пользователя: 

this.itemRef = this.db.object('report/8D3sENaBcLaXoGNnh1MPuoyj5LP2/-LWl294Hs6YjkvJE5pqi');

Первый подраздел 8D3sENaBcLaXoGNnh1MPuoyj5LP2 здесь - это UID пользователя, чей отчет вы показываете, а -LWl294Hs6YjkvJE5pqi - первый отчет этого пользователя.

Если вы хотите отобразить все отчеты для пользователя , вам необходимо будет снова узнать ключ пользователя и передать его в базу данных. Но так как вы затем возвращаете список отчетов, вам также необходимо использовать сервис list от AngularFire и выполнить цикл по результатам в вашем HTML-шаблоне, чтобы он генерировал элементы для каждого отчета: 

this.reports = this.db.list('report/8D3sENaBcLaXoGNnh1MPuoyj5LP2');

И 

<ul>
  <li *ngFor="let report of reports | async">
     {{ item.title }} - {{ item.name }}
  </li>
</ul>

Если вы хотите отобразить вложенный список всех отчетов для всех пользователей , вам следует начать с того же, что и выше, но теперь загрузить данные для всех пользователей и использовать другой ngFor сначала зациклить пользователей.

Также см .:

...