将结果的forkJoin数组传递给Angular中的多个组件

我有一个服务,可以像这样使用forkjoin向服务器发出4个http请求

 getData():Observable<any[]>{
    const response1=this.http.get(URL+'/1')
    const response2=this.http.get(URL+'/2')
    const response3=this.http.get(URL+'/3')
    const response4=this.http.get(URL+'/4')
    console.log("recibido")
    this.data= forkJoin([response1,response2,response3,response4])
    return this.data
}

因此,我想将此结果Observable数组共享给2个必须以不同方式使用forkJoin结果的组件。 显然,两次调用该函数不起作用,因为Angular不允许我同时显式发出两个HTTP请求

我以前使用@Output Decorator发送数据

 data: dataChart
  @Output() change: EventEmitter<dataChart> = new EventEmitter()
  toggleData(podata: dataChart) {
    console.log('do toggle')
    this.data = podata;
    //this.isOpen = !this.isOpen;
    this.change.emit(this.data);
    console.log(this.data)
  }

我在组件上调用toggleData()来设置变量this.data,然后我调用了

this.service.change.subscribe(data=>{ 
 //Handle the data
}) 

在4个组件中能够处理来自第一个组件的数据。

请注意,所有组件都是兄弟姐妹

是否可以用forkJoin做到这一点? 有没有其他方法可以从http服务器获取数据并将其结果用于各种组件?

lh2009168 回答:将结果的forkJoin数组传递给Angular中的多个组件

实际上,您无需在此处使用主题。但是您需要做两件事:

1:不用这样的函数,而要使用这样的属性:

(f comp g) comp h == f comp (g comp h)

顺便说一句。 public data = forkJoin([this.http.get(URL+'/1'),...]) 还支持传递对象以提高可读性,例如

forkJoin
  1. 您需要根据使用情况使用适当的多播机制。 如果您同时订阅Observable,则很可能是public data = forkJoin({someProp: this.http.get(URL+'/1'),...}) 否则是share,所以看起来像这样:
shareReplay(1)

RxJS中的多播运算符也在幕后使用“主题”,但是您不必管理其生命周期,此外,它与可观察到的源紧密相关。在整个地方打电话给下一个对象时,对象容易被滥用和污染。

本文链接:https://www.f2er.com/3155136.html

大家都在问