无法将“订阅”类型分配给“可观察”类型 <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);
      });
  }