类型“Promise<Observable<Object>>”角度服​​务调用上不存在属性“订阅”

Question

尝试在 Angular 中为组件进行初始化时的服务调用，我从中获取数据的服务器需要一些时间来响应，因此我尝试使用承诺将返回的数据分配给我的 this.stats组件

在尝试编写函数时，我得到 -> 我的“订阅”（在我的组件中）的“Promise”类型上不存在属性“订阅”我试图重写函数几次方式，我无法改变错误，我可能只是在做这个根本错误，但在这里找不到任何与我的确切情况相匹配的东西，所以我想我会寻求任何可能的解释...... . 也许我需要改变一些类型转换？

组件

export class StatsComponent implements OnInit {
  @Input() stats: any
  @Output() onUpdateStats: EventEmitter<Object> = new EventEmitter()

  constructor(private specsService: SpecsService) { }

  async ngOnInit(): Promise<void> {
    await this.specsService.getStats().subscribe((response) => {this.stats=response});
  }

  updateStats(){
    console.log(this.stats)
    this.onUpdateStats.emit()
    
  }

}

services.ts

 async getStats():Promise<Observable<Object>>{
    return await this.http.get(`http://localhost:8888/fetchStats`)
   
  }

Answer 1

你不应该把 promise 和 observable 混在一起。 Angular 自带的 RxJs 使用了 Observable 设计模式，你一定要坚持它，避免使用 async/await。

服务：

getStats():Observable<Object>{
   return this.http.get(`http://localhost:8888/fetchStats`)
}

组件：

export class StatsComponent {
  @Output() onUpdateStats: EventEmitter<Object> = new EventEmitter();
  stats: Observable<Object>;

  constructor(private specsService: SpecsService) {
      this.stats = this.specsService.getStats();
  }

  updateStats(){
    console.log(this.stats)
    this.onUpdateStats.emit()
  }

}