Angular 从firestore中提取数据时出现角度应用程序类型错误

我正在尝试从firebase检索一个名为“availableExercises”的集合。我使用的是rxjs 6，当我映射并分配对象中的值时，会出现一些错误

不知怎么的，这个应用程序仍然在运行，但我对这个错误感到非常困惑

我的练习模式如下：

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

以下是我正在调用的函数：

 fetchAvailableExercises() {
    this.db
      .collection('availableExercises')
      .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
            };
          });
        })
      )
      .subscribe((exercises: Exercise[]) => {
        this.availableExercises = exercises;
        this.exercisesChanged.next([...this.availableExercises]);
      });
  }

运行ng serve时出现以下错误：

ERROR in src/app/training/training.service.ts(26,44): error TS2339: Property 'name' does not exist on type '{}'.
src/app/training/training.service.ts(27,48): error TS2339: Property 'duration' does not exist on type '{}'.
src/app/training/training.service.ts(28,48): error TS2339: Property 'calories' does not exist on type '{}'.

以下是我的依赖项：

"dependencies": {
    "@angular/animations": "^6.1.0",
    "@angular/cdk": "^6.4.1",
    "@angular/common": "^6.1.0",
    "@angular/compiler": "^6.1.0",
    "@angular/core": "^6.1.0",
    "@angular/flex-layout": "^6.0.0-beta.17",
    "@angular/forms": "^6.1.0",
    "@angular/http": "^6.1.0",
    "@angular/material": "^6.4.1",
    "@angular/platform-browser": "^6.1.0",
    "@angular/platform-browser-dynamic": "^6.1.0",
    "@angular/pwa": "^0.6.8",
    "@angular/router": "^6.1.0",
    "@angular/service-worker": "^6.1.0",
    "angularfire2": "^5.0.0-rc.11",
    "core-js": "^2.5.7",
    "firebase": "^5.3.0",
    "hammerjs": "^2.0.8",
    "rxjs": "^6.2.2",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.7.0",
    "@angular/cli": "^6.0.8",
    "@angular/compiler-cli": "^6.1.0",
    "@angular/language-service": "^6.1.0",
    "@types/jasmine": "^2.8.8",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "^10.5.4",
    "codelyzer": "^4.4.2",
    "jasmine-core": "~3.1.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^2.0.5",
    "karma-chrome-launcher": "~2.2.0",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^2.0.1",
    "karma-jasmine": "^1.1.2",
    "karma-jasmine-html-reporter": "^1.2.0",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "^2.7.2"
  }

如果I

console.log（doc.payload.doc.data（））
我将预期数据作为对象获取，如下所示：
{carries:8，duration:60，name:“Burpees”}
您的订阅需要一个
Exercise
对象数组，但它得到的是一个通用对象数组

不要执行
return{
，而是创建一个类型为
Exercise
的对象并返回它

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

我还建议在集合中定义一个类型

this.db.collection<Exercise>('availableExercises')

this.db.collection（'availableExercises'））
您的订阅需要一个
Exercise
对象数组，但它得到的是一个通用对象数组

不要执行
return{
，而是创建一个类型为
Exercise
的对象并返回它

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

我还建议在集合中定义一个类型

this.db.collection<Exercise>('availableExercises')

this.db.collection（'availableExercises'））
如果您使用console.log（doc），您是否获得了记录？@SureshKumarAriya是的，我收到了我期望的结果，如果您使用console.log（doc），doc是firebase提供的一个带有效负载的对象你收到记录了吗？@SureshKumarAriya是的，我收到了我期望的，doc是firebase的一个对象，有一个有效负载。在集合中定义类型似乎是我需要的修复。在集合中定义类型似乎是我需要的修复。