Angular 4异步数据存储

Question

我正在创建一个测试应用程序，该应用程序在Firebase上托管了数千个问题。 为了防止多次下载问题，我实现了一个问题服务，其中在构造函数中下载了问题：

this.db.list("questions/", { preserveSnapshot: true}).subscribe(snapshots => {...}

这将下载问题并将其推送到问题数组，这样我就不必在下一个会话之前重新下载。 我还有一个功能来解决这些问题：

getQuestion(){
    return this.questions[0];
}

但是，由于getQuestion()的异步特性，通常在getQuestion()之前尚未下载数据，因此返回未定义。

有没有适当的方法来以角度实现此数据存储类型模式，并确保构造函数中的异步调用在调用getQuestion()之前完成？

我尝试添加一个变量ready ，将其初始化为false，并在异步调用返回时将其设置为true。 然后，将getQuestions()修改为：

getQuestion(){
    while(!this.ready()){}
    return this.questions[0];
}

但是，这只会导致应用挂起。

Answer 1

几乎从来没有必要使用preserveSnapshot 。 不必担心快照是使用AngularFire的主要好处之一。 只需编写this.db.list(PATH).subscribe(list => 。

您将“下载”与“订阅”混淆了。 在服务内部订阅并在本地存储数据从来都不是一个好主意-正如您所发现的那样，您永远无法确定订阅处理程序何时运行。

取而代之的是，该服务应提供一个可观察到的，消费者（通常是组件）将消耗的东西。 这些使用者可以订阅可观察对象并执行他们想要的任何事情，包括静态存储数据，或者最好使用async管道直接在模板内订阅可观察对象。

一般规则是尽可能晚地订阅-理想情况是在模板中。 将您的代码编写为一组可观察的对象，您可以对其进行映射，过滤和组合。

Firebase缓存结果，通常您不必担心自己缓存。

Answer 2

从FireBase下载数据后，调用getQuestion()函数。 使用打击代码：

this.db.list("questions/").subscribe(list => {...} //etc