Angular6：控制应用程序内部的数据共享

Question

In my Angular application, I have the subscription in every single component for watching if the user's Company change. On app init I download user's Company , so subscription fires once in every component I'm subscribing for changes in the state of the company (it's necessary because I am using this Company data in most of them). One of my components have a subscription to Company , and it downloads data once on init. When I change the view, a subscription is no more fired, so I need to download data. Code looks like

    this.subscription = this
    .companyService
    .CompanyState
    .subscribe((company: Company) => {
        this.getSomeData()
    })
    this.getSomeData()

I've tried adding some flag like needDownload with default value true, and set it to false if subscription fires this.getSomeData() , but it's async and doesn't work very well. If I remove the subscription from this component, I will stop watching changes on Company state. If I remove this.getSomeData() from the end of this code, I will not get data if the component is initiated without default call on subscription. The problem is I am downloading data twice, and I feel like it's possible to do it once.

Answer 1

In your service, you can define companySubject as a ReplaySubject instead of a Subject . The buffer size can be set to 1, so that it "replays" only the last emitted value.

private companySubject = new ReplaySubject<Company>(1);

A new view will be notified as soon as it subscribes to the observable, if CompanyState has already emitted a value. As a consequence, you can remove the direct call to getSomeData() in your component initialization code.

See this answer for details about the various Subject classes.