角火查询集合文档示例代码不起作用答案

【问题标题】：angular fire querying-collections docs sample code not working角火查询集合文档示例代码不起作用
【发布时间】：2020-11-21 03:03:33
【问题描述】：

我正在阅读 angular fire 文档，特别是这个 https://github.com/angular/angularfire/blob/master/docs/firestore/querying-collections.md

低于示例代码的位置

this.items$ = combineLatest(
  this.sizeFilter$,
  this.colorFilter$
).pipe(
  switchMap(([size, color]) => 
    afs.collection('items', ref => {
      let query : firebase.firestore.CollectionReference | firebase.firestore.Query = ref;
      if (size) { query = query.where('size', '==', size) };
      if (color) { query = query.where('color', '==', color) };
      return query;
    }).valueChanges()
  )
);

我从“this.items$”收到此错误

类型“Observable”不可分配给类型“Observable”。类型 'unknown[]' 不能分配给类型 'Item[]'。类型“{}”缺少类型“项目”的以下属性：文本、颜色、大小（2322）

我错过了什么？

我正在使用 Visual Studio Code，这些是 Angular 和 Angular fire 的版本

Angular v10.0.4 @angular/fire@^6.0.2

这几天我一直在努力解决这个问题。希望有人能给点建议。

【问题讨论】：

你是如何以及在哪里初始化 sizeFilter$ 和 colorFilter$ 的？和例子一样吗？
你缺少泛型 --> afs.collection 中的类型注释。这就是它返回 Uknown[] 错误的原因。
就像例子是的
@sagat 你的意思是应该是这样的 afs.collection('collection name')
是的，就像我的回答一样

标签： javascript angular firebase google-cloud-firestore angularfire2

【解决方案1】：

afs.colelction 中缺少通用类型，应为 --> afs.collection<Item>。这就是它返回 Unknown[] 错误的原因。

this.items$ = combineLatest(
  this.sizeFilter$,
  this.colorFilter$
).pipe(
  switchMap(([size, color]) => 
    afs.collection<Item>('items', ref => { // generic type required here
      let query : firebase.firestore.CollectionReference | firebase.firestore.Query = ref;
      if (size) { query = query.where('size', '==', size) };
      if (color) { query = query.where('color', '==', color) };
      return query;
    }).valueChanges()
  )
);

【讨论】：

【解决方案2】：

看来我一直在想太多，也太相信文档了。感谢@sagat 再次查看这个。 Angular Fire 文档需要更新。

文档应该这样写代码

afs.collection<Item>('items')

它不再打扰 Visual Studio Code。

【讨论】：