Firestore：将 angularfire2 异步数据传递为 Ionic 3 navParams 不起作用

Question

cities: Observable<any>;


this.cities = this.fsProvider.collection('cities').map(cities => {
    return cities.map(city => {
      city.country = this.fsProvider.doc(`countries/${city.country_id}`);
      return city;
    });
});

city 包含country 信息作为Observable 数据。因此，如果我将city 作为navParam 传递到另一个页面，只是this.navCtrl.push(AnotherPage, {city: city})，我无法在AnotherPage 上获取国家/地区信息。

我刚刚在此处添加了演示：https://stackblitz.com/edit/ionic-firestore。

欢迎提出任何想法。

Answer 1

原因是当您将city 传递给ContactPage 时，country Observable 将不会再次发送数据。让我们详细看看。您的场景：

首先，您将cities 定义为Observable。当cities 获取数据时，它会显示在模板中，您可以在点击函数中捕获city 对象。请注意，city 是一个对象，而不是Observable，因此您可以直接同步使用它。这就是city.name 在两个页面中都显示的原因。

第二，您将city.county 定义为Observable，然后通过async 绑定在模板中显示它.在此步骤中，您将订阅Observable，firebase 服务将向您发送您想要的数据并且永远不会再次发送，除非您的数据库发生任何变化。

最后，您将city 对象发送到ContactPage。 city.country 仍然是 same Observable，正如我上面所说，除非数据库发生任何变化，否则您无法获取数据。只需编辑您的数据库，您就可以在控制台日志中看到国家/地区。

因此，解决方案只是在 2 页中使用 2 个不同的 Observable，方法是将 city.country 再次设置为 firebase Observable。我猜你确实找到了它并在ContactPage 中评论它。
如果您有任何问题，请随时提出。

Answer 2

您的国家收藏设置是否正确？当我移动

if (this.city) {
      this.city.country.subscribe((country) => {
        console.log(country);
      }, () => {
        console.log('finished');
      }, (error) => {
        console.log(error);
      });
    }

进入 onItemClick() 事件，它也从未从 .subscribe 返回。

* 更新 *

在主页上删除国家/地区的显示，它可以正常工作。问题似乎是您不能多次订阅 Firestore observable。即它不会重新运行查询，它只会让您等待下一个永远不会出现的项目。