将 firebase 数据库值推送到新数组中答案

【问题标题】：Pushing firebase database values into new array将 firebase 数据库值推送到新数组中
【发布时间】：2019-01-02 16:35:15
【问题描述】：

我正在尝试通过 Ionic 打字稿文件将 Firebase 数据库值推送到新数组中。

问题是，我不断收到错误：

错误：未捕获（承诺中）：TypeError：无法读取未定义的属性“empList”

我真的不明白为什么，因为我还在学习 Typescript，不知道该怎么做。

firebase JSON 如下所示：

- users
  - hJfEgXkyaKPckchL3kx8rpZ58Ew2
    -LV6c8E5rRD4_mQqsb6Q
      - name: "Emily Blunt"
      - points: 20
      - grade: 12

export class Tab1Page {
  name: string;
  grade: number;
  points: number;
  empList: Array<{name: string, grade: number, points: number}> = [];

  constructor() {
    const usersRef = firebase.database().ref('/users/');
    const ref = usersRef.orderByChild('points');
    
    ref.once('value').then(function(snap) {
      snap.forEach(function (childSnap) {
        const pkey = childSnap.key;
        // returns 'hJfEgXkyaKPckchL3kx8rpZ58Ew2'

        const keyRef = firebase.database().ref('/users/' + pkey);
        const ref2 = keyRef.orderByChild('name');

        ref2.once('value').then(function(snap) {
          snap.forEach(function (childSnap) {
            const key = childSnap.key;
            //returns -LV6c8E5rRD4_mQqsb6Q
            const firebaseRef = firebase.database().ref('/users/' + pkey + '/' + key);
            
            firebaseRef.once('value').then(function(snapshot) {
              const name = snapshot.val().name;
              const grade = snapshot.val().grade;
              const points = snapshot.val().points;
              // returns 'Emily Blunt', 12, 20
              this.empList.push({
                name: name,
                grade: grade,
                points: points
              });
            });
          });
        });
      });
    });
  }
}

任何帮助将不胜感激。

【问题讨论】：

显示您使用empList的组件页面？

标签： javascript typescript firebase ionic-framework firebase-realtime-database

【解决方案1】：

问题的原因是您的 this 回调函数中的 this 对象范围不正确。它实际上指的是Firebase.Promise。您需要保存对引用您的类的this 的引用，然后在firebase 回调中使用它：

export class Tab1Page {
  name: string;
  grade: number;
  points: number;
  empList: Array<{name: string, grade: number, points: number}> = [];

  constructor() {
    const usersRef = firebase.database().ref('/users/');
    const ref = usersRef.orderByChild('points');
    const self = this;
    ref.once('value').then(function(snap) {
      snap.forEach(function (childSnap) {
        const pkey = childSnap.key;
        // returns 'hJfEgXkyaKPckchL3kx8rpZ58Ew2'

        const keyRef = firebase.database().ref('/users/' + pkey);
        const ref2 = keyRef.orderByChild('name');

        ref2.once('value').then(function(snap) {
          snap.forEach(function (childSnap) {
            const key = childSnap.key;
            //returns -LV6c8E5rRD4_mQqsb6Q
            const firebaseRef = firebase.database().ref('/users/' + pkey + '/' + key);

            firebaseRef.once('value').then(function(snapshot) {
              const name = snapshot.val().name;
              const grade = snapshot.val().grade;
              const points = snapshot.val().points;
              // returns 'Emily Blunt', 12, 20
              self.empList.push({
                name: name,
                grade: grade,
                points: points
              });
            });
          });
        });
      });
    });
  }
}

您可以查看另一个 SO 答案以了解有关 this 绑定的更多详细信息：How does the this keword work

【讨论】：