AngularFirestore: Property 'id' does not exist on type 'QueryDocumentSnapshot<any>'

Question

This is an Angular5 and Firestore issue

What I want to do

• Grab a Firestore Collection, which in my database is called minutes

• Set my component variable, also called minutes, equal to an Observable object that includes each minute document ID.

Right now I'm getting this error

Property 'id' does not exist on type 'QueryDocumentSnapshot<any>'

This is where I gather my collection from Firestore

minutesArray: AngularFirestoreCollection<any>;
minutes: Observable<any[]>;

constructor(private afs: AngularFirestore) {
  this.minutesArray = afs.collection<any>('minutes', ref => ref.orderBy('year', 'desc'));
  this.minutes = this.minutesArray
                   .snapshotChanges()
                   .pipe(map(actions => actions.map(a => {
                       const data = a.payload.doc.data();
                       #### NEXT LINE ERRORS OUT ####
                       const id = a.payload.doc.id;
                       return { id, ...data };
                     }))
                   );

Why is this error being thrown?

This Github Issue did not provide answers.

`

Answer 1

Try to use:

doc.payload.doc['id']

Instead of:

doc.payload.doc.id

Answer 2

Enabling allowSyntheticDefaultImports in the tsconfig.json resolved this issue for me

"allowSyntheticDefaultImports": true