我该如何解决 - “动作”类型上不存在属性“地图”

Question

下面的代码片段是我的 ionic3/angularfire2 项目的一部分。它连接到 Firestore 数据库 - 并应返回文档的可观察快照。

从我的网络研究中，我可以看到其他人使用了类似的语法 - 我找不到我的解决方案

// (all other imports are fine)

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';

在构造函数中，我注入...

private db: AngularFirestore

下面的代码有错误（我很不高兴）

// customerRef: AngularFirestoreDocument<Customer>;
this.customerRef = this.db.doc(`customers/${k}`);

// cust: Observable<Customer>;
this.cust = this.customerRef.snapshotChanges().map(actions => {
  return actions.map(action => {
    const data = action.payload.doc.data() as Customer;
    const id = action.payload.doc.id;
    console.log('>>>>', { id, ...data });
    return { id, ...data };
  });
});

我收到以下错误

Typescript Error
Property 'map' does not exist on type 'Action<DocumentSnapshot>'.

我还有项目的其他部分可以检索某些文档 (.valueChanges) 集合的 observable - 它们工作得很好。

请帮忙。（如果我错过了描述某些东西，我道歉 - 如果有人指出，我会这样做 - 试图专注于有错误的代码）

Angular CLI: 1.5.5
Node: 6.12.0
OS: darwin x64
Angular: 5.0.3

    "@ionic-native/core": "4.4.0",
    "@ionic-native/splash-screen": "4.4.0",
    "@ionic-native/status-bar": "4.4.0",
    "@ionic/pro": "1.0.16",
    "@ionic/storage": "2.1.3",
    "angularfire2": "^5.0.0-rc.4",
    "firebase": "4.8.0",
    "ionic-angular": "3.9.2",
    "promise-polyfill": "^7.0.0",
    "rxjs": "5.5.2",

Answer 1

这里的问题是在处理文档或文档集合时对 snapshotChanges() 的行为方式的混淆。

您使用的代码适用于文档集合，但在处理文档时它会略有变化。

尝试这个。

// customerRef: AngularFirestoreDocument<Customer>;
this.customerRef = this.db.doc(`customers/${k}`);

// cust: Observable<Customer>;
this.cust = this.customerRef.snapshotChanges().map(action => {
  const data = action.payload.data() as Customer;
  const id = action.payload.id;
  return { id, ...data };
});

对于使用较新 rxjs 的 Angular 6+

// customerRef: AngularFirestoreDocument<Customer>;
this.customerRef = this.db.doc(`customers/${k}`);

// cust: Observable<Customer>;
this.cust = this.customerRef.snapshotChanges().pipe(map(action => {
  const data = action.payload.data() as Customer;
  const id = action.payload.id;
  return { id, ...data };
}));