Firebase возвращает сложный объект вместо данных, которые я хочу

Question

Итак, я использую angularfire2 и пытаюсь получить данные из моего проекта Firebase, находящегося в базе данных реального времени. Вместо этого он продолжает извлекать странный и очень сложный объект из моей базы данных.

people: AngularFireList<Object[]>

constructor(
public userService: UserService,
public authService: AuthService,
private route: ActivatedRoute,
private location: Location,
private fb: FormBuilder,
private afAuth: AngularFireAuth,
private afs: AngularFirestore,
private http: HttpClient,
private db: AngularFireDatabase
) {
    this.people = this.db.list('/thisisatest');
    console.log(this.people);
}

Вот как настроена моя база.

Но я возвращаю этот безумный сложный объект! Где мои данные?

Answer 1

Это потому, что db.list() не может вернуть список напрямую, во-первых, потому что он возвращает класс, который позволяет вам выполнять более сложные задачи (.add(), .remove(), .update()), но также потому, что данные еще не загружен.

Angular очень хорошо работает с наблюдаемыми, и это предпочтительный способ сохранить связь данных в угловом формате. Я не могу объяснить Observables для вас в этом посте, но я могу быстро показать вам, как мы можем регистрировать полученные значения (как они получают несколько значений с течением времени, так как база данных обновляется)

Во-первых, чтобы получить наблюдаемое значение, мы можем сделать

this.db.list('/thisisatest').valueChanges(); // This returns the observable

Как описано здесь: https://github.com/angular/angularfire2/blob/master/docs/rtdb/lists.md#retrieve-data Скорее всего, в вашем приложении вы захотите

this.people = this.db.list('/thisisatest').valueChanges();

Если вы хотите console.log значения для отладки, вы можете сделать (в дополнение к назначению this.people)

this.db.list('/thisisatest').valueChanges().subscribe(people_value => {
  console.log('people:', people_value);
});

Все равно стоило бы прочитать больше об Обсерваториях, поскольку их не так просто понять:)