角度及;AngularFire 5从文档中检索数据 我用的是什么 角度5 角火 Firebase&Firestore 我想要达到的目标

角度及;AngularFire 5从文档中检索数据 我用的是什么 角度5 角火 Firebase&Firestore 我想要达到的目标,angular,firebase,angularfire2,google-cloud-firestore,angularfire5,Angular,Firebase,Angularfire2,Google Cloud Firestore,Angularfire5,我目前正在使用谷歌Firebase的新Firestore创建一个新应用程序,同时学习angular。我的应用程序当前创建了一个名为链接的集合,并使用用户添加链接时生成的自定义id创建了一个新文档,该文档中有4个字段: 液体 网址 短网址 咔哒声 我希望应用程序在url字段中查询文档中的数据 到目前为止我所拥有的 我已创建正确文档的路径: linkCollection: Observable<{}>; constructor(private afs: AngularFire

我目前正在使用谷歌Firebase的新Firestore创建一个新应用程序,同时学习angular。我的应用程序当前创建了一个名为链接的集合,并使用用户添加链接时生成的自定义id创建了一个新文档,该文档中有4个字段:

  • 液体
  • 网址
  • 短网址
  • 咔哒声
我希望应用程序在url字段中查询文档中的数据

到目前为止我所拥有的 我已创建正确文档的路径:

  linkCollection: Observable<{}>;
  constructor(private afs: AngularFirestore, private router: Router) {
      this.path = this.router.url.replace('/','');
      afs.collection('Links').doc(this.path).valueChanges();
  }
linkCollection:可见;
构造器(专用afs:AngularFirestore,专用路由器:路由器){
this.path=this.router.url.replace('/','');
afs.collection('Links').doc(this.path).valueChanges();
}
我被困的地方
这可能是一个简单的解决方案,但我不知道如何获取url字段。我拥有的代码能够检索文档,我在另一节中使用了类似的方法来检索所有文件,并使用*ngs显示数据,但我不确定如何在ts文件中而不是模板中执行此操作。

以下是将文档作为可观察对象读取并在组件中使用其数据的基本模式模板

linkRef:AngularFirestoreDocument;
链接:可观察;
路径:字符串;
构造函数(专用afs:AngularFirestore,专用路由器:路由器){}
恩戈尼尼特(){
//0.这是可行的,但可能有更好的方法获取ID
this.path=this.router.url.replace('/','');
//1.作参考
this.linkRef=this.afs.collection('links').doc(this.path)
//2.获得可观察的结果
this.link=this.linkRef.valueChanges();
}
然后,在HTML中,您可以展开可观察对象并显示URL属性

{{ (link | async)?.url }}
或者,您可以通过在TS中的某个位置手动订阅来打开它,但您也应该在Ngondestory期间取消订阅,以避免内存泄漏

this.link.subscribe(数据=>console.log(数据))

我知道如何在HTML中展开它,但如何在Typerscript文件中展开它?我需要使用url创建一个函数,但我不确定如何访问它。我只是更新了代码。你所需要做的就是订阅。(异步管道会在引擎盖下自动完成这项工作)。我完全按照您所说的做了,并让控制台记录数据,但当我尝试以下操作时:
this.link.subscribe(data=>this.data=data);console.log(this.data)控制台日志未定义。如何将数据分配给变量?这是一个异步操作-如果您在subscribe块中使用console.log,将定义该操作。