AngularFire2 V5类型错误：Observable<{}[]>无法赋值给Observable<any[]>

问题根源 #

你碰到的这个错误，是因为AngularFire2 v5里db.list().valueChanges()默认返回的是Observable<{}[]>类型（空对象数组的Observable），但你声明的exercisesList$是Observable<any[]>，TypeScript的严格类型检查会判定这两个类型不兼容，所以抛出了赋值错误。

解决方案 #

这里有几种实用的解决办法，按推荐程度排序：

1. 给list()指定泛型类型（最推荐）

直接在调用db.list()时明确泛型类型，让valueChanges()返回你需要的Observable类型：

// 修改workoutProvider里的getExercises方法
getExercises(): Observable<any[]> {
  return this.db.list<any>(`Exercises/${localStorage.getItem('workoutName')}`).valueChanges();
}

如果你的Exercise有明确的属性结构，更建议定义一个专属接口来替代any，这样类型更严谨，代码也更好维护：

// 先定义Exercise接口，根据你的业务属性补充
interface Exercise {
  name: string;
  duration: number;
  sets: number;
}

// 调整组件里的变量声明
exercisesList$: Observable<Exercise[]>;

// 再修改workoutProvider的方法
getExercises(): Observable<Exercise[]> {
  return this.db.list<Exercise>(`Exercises/${localStorage.getItem('workoutName')}`).valueChanges();
}

2. 赋值时使用类型断言

如果不想修改getExercises()的返回类型，可以在赋值时用as关键字强制断言类型：

ionViewDidLoad() { 
  this.exercisesList$ = this.workoutProvider.getExercises() as Observable<any[]>; 
}

3. 调整变量的类型声明

直接把exercisesList$的类型改成Observable<{}[]>，不过这种方式灵活性较差，不太推荐：

exercisesList$: Observable<{}[]>;

小提示 #

TypeScript的类型系统就是为了帮我们提前规避潜在问题，所以尽量用自定义接口来规范数据结构，少用any，这样你的代码会更健壮，后期维护也更省心。

内容的提问来源于stack exchange，提问作者Khaled Ramadan