'How do i query a collection with the new change in @angular/fire version 7.2.0?

I would like to query the items collection by filtering out only documents that have a certain ID.

import { Firestore, collectionData, collection } from '@angular/fire/firestore';
import { Observable } from 'rxjs';

interface Item {
  name: string,
  ...
};

@Component({
  selector: 'app-root',
  template: `
  <ul>
    <li *ngFor="let item of item$ | async">
      {{ item.name }}
    </li>
  </ul>
  `
})
export class AppComponent {
  item$: Observable<Item[]>;
  constructor(firestore: Firestore) {
    const collection = collection(firestore, 'items');
    this.item$ = collectionData(collection);
  }
}


Solution 1:[1]

I manage to query by following the following steps

// Import statement
import { Firestore, collectionData, collection,where,query } from '@angular/fire/firestore';

// Please define an Observable like below
Items: Observable<Item[]>; // Item being a model

// inside your function
const appRef = collection(this.firestore, 'items')
const appQuery = query(appRef, where('uid', '==', userId));

this.Items= (await collectionData(appQuery)).pipe(
    map((actions) => {
      return actions.map((a) => {
        const data = a as Item;
        const uid = a.id;
        return { uid, ...data };
      });
    })
  );

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Yushin