Javascript 如何将firebase查询对象存储在angular中的变量中？

我正在尝试使用ionic对firebase数据库进行查询。我想将对象snapshot.val（）存储在一个变量中，目的是在HTML代码中显示其内容，但我正在努力解决upcomingOrders变量的范围问题

如何在回调中更新变量

  onFetchMyUpcomingOrders(){
    var upcomingOrders = {}
    const userId = this.authService.getActiveUser().uid;
    var ref = firebase.database().ref("orders/confirmed");
    ref.orderByChild("client/clientId").equalTo(userId).once("value", (snapshot) => {
        upcomingOrders= snapshot.val()
        console.log(upcomingOrders)
      });
    console.log(upcomingOrders) // Empty object, should contain snapshot.val()
  }  

---

它似乎正在按值更新。如何通过引用更新它？

数据是从Firebase异步加载的。加载数据时，函数继续运行。当您的

console.log（）

刚好在函数结束之前执行时，数据尚未加载。然后，当数据可用时，将调用回调函数

因此：您的

upcomingOrders

变量设置正确，只是不是在您当前需要它的时候

要使此代码正常工作，必须将需要数据的所有代码移动到回调函数中。因此，如果要更新HTML，请从回调内部执行此操作：

onFetchMyUpcomingOrders(){
  var upcomingOrders = {}
  const userId = this.authService.getActiveUser().uid;
  var ref = firebase.database().ref("orders/confirmed");
  ref.orderByChild("client/clientId").equalTo(userId).once("value", (snapshot) => {
    upcomingOrders= snapshot.val()
    // TODO: update HTML and do whatever else needs the data
  });
}

这是使用现代web API时非常常见的模式。数据一直是异步加载的，像这样的回调（或更现代的等价物，如or）是处理数据的唯一方法