有没有办法在外部变量中检索承诺或可观察的值？答案

【问题标题】：Is there a way to retrieve the value of a promise or observable in an external variable?有没有办法在外部变量中检索承诺或可观察的值？
【发布时间】：2020-03-04 15:43:43
【问题描述】：

我已阅读有关 .then() 的所有内容，并且了解它的工作原理，并且它实际上在我当前的实现中发挥作用，并为我提供了我正在寻找的价值。

async getDay() {
    try {
      let ref = this.db.getDay(this.dateFirebase);
      ref.then(out => {
        out.get().then(inner => {
          console.log(inner.data());
        })
      })
    } catch (err) {
      console.log(err);
    }
  }

inner.data() 为我提供了我需要使用的确切对象，但我无法在组件中的其他任何地方使用它，无法将其分配给任何组件属性，也无法将其超出此范围.

我现在要做的是检索inner.data()，这是一个包含几个字段的基本对象，然后将其显示在 HTML 模板中，稍后将其用于各种其他目的。如果我想从其中获取对象，我只能通过每次调用.then() 来做到这一点，还是有办法将它存储在局部变量中？

如果我这样做：

out.get().then(inner => {
          console.log(inner.data());
          this.day = inner.data();
          console.log(this.day);
   })

其实可以看到数据，然后我把组件属性day设置成数据，然后打印出属性，就可以看到里面记录的数据了。在另一种方法中，我运行了一个 setInterval 函数，它打印出 day 属性，即使在我成功设置属性之后，它也会不断打印 undefined。

似乎无论我做什么，promise 中的值都不能在它之外使用，即使它已经被检索到。我在这里做错了什么？

【问题讨论】：

问题是时间问题之一。首先，您只能从带有await 或.then() 的promise 中获取值。其次，您知道该值实际可用的唯一位置是在.then() 处理程序内部或await 之后或在您从那里调用并将其传递给的某些函数中。因此，虽然您可以将它分配给对象属性或更高范围的变量，但它通常不是很有用，因为外部代码不知道属性或变量现在何时包含有用的值。因此，只需将其与 .then() 或 await 一起使用并学习以这种方式编写代码。
我仍在努力理解您将如何在 HTML 模板中使用此值。我稍微改变了我的实现，所以this.day 存储了out.get() 返回的承诺，然后尝试在ngFor 循环中使用async 管道，但没有打印出来。没有模板错误，但我的<p> 标签仍然是空的。我想我正确使用了管道：<div *ngFor="let item of day | async">.
您必须获取异步值，并且仅当您拥有它以及您需要的任何其他异步值时，然后才呈现您的模板。很可能您必须在 .then() 或 await 之后触发模板的渲染，这样您就知道在渲染之前您拥有所需的值。

标签： angular asynchronous promise

【解决方案1】：

使用 await，这样您就可以等待每个 Promise 解决。

function async getDay() {
    try {
      const out await this.db.getDay(this.dateFirebase);
      const inner = await out.get()
      return inner.data();
    } catch (err) {
      console.log(err);
    }
  }

然后在其他地方调用它：

getDay().then(day => this.day = day)
// or 
this.day = await this.getDay()

【讨论】：