無法將“訂閱”類型分配給“可觀察”類型 <Exercise[]> “

Question

我用

角CLI：6.0.8

節點：8.11.3

我剛剛通過Angular Material，Angularfire和NgRx學習了Udemy-Angular（完整應用程序）。 在第72課上，聆聽值更改（of_Firestore）我有一個錯誤

 export class NewTrainingComponent implements OnInit { exercises: Observable<Exercise[]>; constructor( private trainingService: TrainingService, private db: AngularFirestore) { } ngOnInit() { this.exercises = 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(result => { console.log(result); }); } onStartTraining(form: NgForm) { this.trainingService.startExercise(form.value.exercise); } } 

錯誤TS2322：無法將“預訂”類型分配給“可觀察”類型。

錯誤TS2339：類型“ {}”上不存在屬性“名稱”。

錯誤TS2339：類型“ {}”上不存在屬性“持續時間”。

錯誤TS2339：類型“ {}”上不存在屬性“卡路里”。

Answer 1

該錯誤信息非常明顯。 exercises是您定義的Observable的類型：

exercises: Observable<Exercise[]>;

但是您可以通過ngOnInit()方法將其分配給預訂。

您的ngOnInit()方法應類似於以下內容（不要將其分配給exercises ）：

ngOnInit() {
    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(result => {
        console.log(result);
      });
  }