使用 AngularFire2/Firestore 从 Ionic/Angular 模板中的文档字段中查找参考答案

【问题标题】：Looking up a reference from a document field from the template in Ionic/Angular with AngularFire2/Firestore使用 AngularFire2/Firestore 从 Ionic/Angular 模板中的文档字段中查找参考
【发布时间】：2018-06-15 13:47:51
【问题描述】：

我正在开发一个 Ionic 3 应用程序（使用 Angular 4）。我正在使用 Angularfire2 与我的 Firestore 数据库进行交互。目前，我正在将一个文档作为可观察对象检索并在我的模板中显示它的字段。

我的问题是文档中的一个字段是对另一个文档（类别）的引用。从模板中，我正在尝试做这样的事情：

<ion-badge>{{ getCategory( (pro.element | async)?.category ) }}</ion-badge>

它正在调用我的提供程序中的一个函数，如下所示：

getCategory(ref:AngularFirestoreDocument<Category>){
   if(ref){
     ref.valueChanges().subscribe(val =>{
       return val.name;
     });
   }
}

我不知道这是否是检索参考文档的适当/可持续方式，因为我已经查看了所有内容，但没有找到任何详细的文档。当我记录它时，它似乎迭代了数千次，返回一个DocumentReference 对象，但我得到valueChanges() 不是函数的错误。

在这种情况下，任何关于最佳实践的指导都将不胜感激。

谢谢

【问题讨论】：

标签： angular ionic3 angularfire2 google-cloud-firestore angularfire5

【解决方案1】：

当您使用异步管道时，这意味着您正在处理可观察或承诺数据。在 getCategory 函数中，你订阅了 observable，我们知道异步管道会为我们做这件事，所以你应该只格式化你的数据。

你的功能是：

import {Observable} from 'rxjs/Observable';
import "rxjs/add/operator/of";

...

getCategory(ref:AngularFirestoreDocument<Category>){
   if(ref){
     ref.valueChanges().map(val =>{
       return val.name;
     });
   }
   else{
       //return an empty string to get rid of any error when there is no ref.
       return    Observable.of("");
   }
}

【讨论】：