在ionic 3中使用Angularfire2从Firestore获取收集文档的ID [英] get the ID of collection document from Firestore using Angularfire2 in ionic 3

问题描述

我正在尝试获取集合的ID以在离子页面上使用它:

I'm trying to get id of the collection to use it in the ionic page:

这是我的界面:

  export interface Item { 
  categoryOfPost: string; 
  imageUrl: string;
  nameOfPost: string;
  cityOfPost: string;
  createdDate: string;
  currencyOfPost: string;
  priceOfPost: number;
  typeOfPost: number;
  statusOfPost: string;
  id?: string;
}

 private itemsCollection: AngularFirestoreCollection<Item>;
  items: Observable<Item[]>;

这是getPosts函数的内容

and this is the content of the getPosts function

  this.itemsCollection = this.afs.collection('posts', ref => ref.orderBy('createdDate', 'desc'));
  this.items = this.itemsCollection.valueChanges(); 

当我想查看我使用的内容时:

when i want to view the content i use:

 <ion-card style="margin-bottom: 25px; background-color: burlywood" *ngFor="let item of items | async">
    <ion-item text-wrap  style="margin-bottom: 25px; background-color: burlywood"> 
        <ion-list >       
          <ion-item> 
            <img src="{{ item.imageUrl }}">            
            cityOfPost: {{ item.id }}            
          <button ion-button (click)="detailpage(item.id)">click to test  </button>
          </ion-item>           
        </ion-list>  
    </ion-item>
  </ion-card>  

我可以在HTML EXCEPT上显示未定义ID的所有内容??? 显示它的正确方法是什么?

I can show everything on the HTML EXCEPT for the ID it comes UNDEFINED ???? what is the correct way to display it ???

谢谢.

推荐答案

这是因为使用valueChanges()剥离了所有快照元数据，仅该方法仅提供了数据"，如文档.

This is because by using valueChanges() "all Snapshot metadata is stripped and just the method provides only the data", as explained in the doc.

您应该使用snapshotChanges()，请参阅文档此处表示:为什么要使用它?-当您需要数据列表但又想保留元数据时."

You should use snapshotChanges(), see the doc here which says: "Why would you use it? - When you need a list of data but also want to keep around metadata."

这篇关于在ionic 3中使用Angularfire2从Firestore获取收集文档的ID的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！