Сделать переменную доступной в AngularFire5 - PullRequest
0 голосов
/ 29 мая 2018

Я пытаюсь получить некоторые данные документа из Firestore, что я нашел достаточно легко сделать.Но как я могу сделать эти данные доступными для других функций?Вот мой код:

let documentRef = this.afs.collection('profiles').doc(this.userId);

var myProfileRef = documentRef.ref.get()
.then(doc => {
    this.myFirstName = doc.data().firstName;
    console.log(this.myFirstName)
})

console.log(this.myFirstName)

Первый раз, когда я пытаюсь записать имя, это работает.Но за пределами}) я получаю 'undefined', и я не могу использовать this.myFirstName нигде вне этого.Чего мне не хватает?

РЕДАКТИРОВАТЬ: Мне кажется, что эта проблема заключается в асинхронной природе работы с данными Firestore.Так что, наверное, я спрашиваю, есть ли синхронный способ получения этих данных?

1 Ответ

0 голосов
/ 29 мая 2018

Поскольку извлечение данных из пожарного хранилища носит асинхронный характер.Вы должны настроить способ асинхронного получения ваших данных, чтобы вы могли иметь эти данные, когда они доступны.Примерно так:

// Way 1: function returns observable 
  getName(): Observable<string> {

    return new Observable (observer =>{
      let documentRef = this.afs.collection('profiles').doc(this.userId);
      documentRef.ref.get()
      .then(doc => {
          let myFirstName = doc.data().firstName;
          observer.next(myFirstName);
          observer.complete();
      })
      .catch(error =>{ console.log(error); })
    });
  }

  // Call function and subcribe to data
  this.getName().subscribe(res =>{
    console.log(res);
  });

  // Way 2: Function returns promise
  getFirstName(): Promise<string> {
    return new Promise(resolve =>{
      let documentRef = this.afs.collection('profiles').doc(this.userId);
      documentRef.ref.get()
      .then(doc => {
          let myFirstName = doc.data().firstName;
          resolve(myFirstName);
      })
      .catch(error =>{ console.log(error); })
    })
  }

  // Use it
  this.getFirstName().then(res =>{
    console.log(res);
  });

Дайте мне знать, если вам действительно нужен рабочий пример?

...