角度/RxJS多播可观测的

Question

我有一个HTTP请求，希望将结果共享给多个组件。当然，HTTP请求返回一个可观察的。我希望多个组件能够订阅此服务，而不会触发额外的HTTP请求。

我在一个组件中使用Subject实现了这一点，该组件按需发出HTTP请求，并有另一种方法订阅该主题。虽然这是可行的，但似乎有些过分，而且肯定有更好的方法。

主题服务

@Injectable()
export class EventService {
    subject: BehaviorSubject<any> = new BehaviorSubject<any>(Observable.create());

    constructor(private api: Api) {}

    fetch = () => {
        this.subject.next(
            this.api.getUsers().pipe(share())
        );
    };

    listen = (): Observable<any> => {
        return this.subject.asObservable();
    };
}

和一个订户

@Injectable
export class EventListenerA {
    constructor(private eventService: EventService){
        eventService.fetch(); // make initial call
        eventService.listen().subscribe(o => {
             o.subscribe(httpResponse => {
                 //do something with response
             })
        });
    }
}

和第二个订户

@Injectable
export class EventListenerB {
    constructor(private eventService: EventService){
        eventService.listen().subscribe(o => {
             o.subscribe(httpResponse => {
                 //do something else with response
             })
        });
    }
}

从管道链中删除share（）时，会发出多个网络请求。是否有一种更优雅/正确的方式将观察到的信息传递给主题的下一个？或者完全是另一种模式




Answer 1

您应该使用ReplaySubject（），而不给它一个初始值。这样，当组件订阅listen（）时，它将等待数据可用。

不需要与其他组件共享HTTP observable。只需订阅HTTP请求，然后将值发送到ReplaySubject（）。任何侦听的组件都将接收数据。

@Injectable()
export class EventService {
     private _events: ReplaySubject<any> = new ReplaySubject(1);

     public constructor(private _api: ApiService) {}

     public fetch() {
         this.api.getUsers().subscribe(value => this._events.next(value));
     }

     public listen() {
         return this._events.asObservable();
     }
 }

 @Injectable
 export class EventListenerA {
     constructor(private eventService: EventService){
          eventService.fetch();
          eventService.listen().subscribe(o => {
              // prints user data
              console.log(o); 
          });
     }
}

每次有人调用eventService.fetch（）它都会触发HTTP请求。如果您希望执行此请求一次，那么可以从服务构造函数或应用程序中仅发生一次的另一个点（即模块构造函数）调用fetch（）。