如何在Angle 7应用程序的rxjs中使用地图运算符?

时间:2019-02-13 23:21:57

标签: angular rxjs ngrx angular7 rxjs6

我的代码可以编译并且一切正常,但是我的IDE(Visual Studio Code)显示以下错误消息,并且我无法部署我的应用程序(使用ng build --prod):

  

src / app / training / training.service.ts(61,46)中的错误:错误TS2339:   类型“ {}”上不存在属性“名称”。   src / app / training / training.service.ts(62,50):错误TS2339:属性   类型“ {}”上不存在“ duration”。   src / app / training / training.service.ts(63,50):错误TS2339:属性   类型“ {}”上不存在“卡路里”。

我这样导入地图运算符:

import { map, take } from 'rxjs/operators';

并像这样使用它:

...
    .snapshotChanges()
    .pipe(
      map(docArray => {
        return docArray.map(doc => {
          return {
            id: doc.payload.doc.id,
            name: doc.payload.doc.data().name,
            duration: doc.payload.doc.data().duration,
            calories: doc.payload.doc.data().calories
          };
        });
      })
    )
...

我的界面如下:

export interface Exercise {
id: string;
name: string;
duration: number;
calories: number;
date?: Date;
state?: 'completed' | 'cancelled' | null;

}

我在做什么错了?

1 个答案:

答案 0 :(得分:1)

要愚弄打字稿,您可以这样做:

doc => {

    let result: any = doc.payload.doc.data();
          return {
            id: doc.payload.doc.id,
            name: result.name,
            duration: result.duration,
            calories: result.calories
          };