angular11 - Angular 11 share data between unrelated components which a service

Question

I am using Angular 11 and I have lots of methods in componentB (to call it one way)

I now have to make the calls to lots of methods that live in componentB from componentA.

I know that I could move all the methods to a service but in this case it would be a lot of work and I only need a fast workaround.

So I would like to keep componentB how it is and be able to call it's methods from componentA.

componentA and componentB are not releated.

Is there a workaround to do this without having to move the methods out of componentB?

question from:https://stackoverflow.com/questions/66060170/angular-11-share-data-between-unrelated-components-which-a-service

Answer 1

You can do it via service, which will be injected in both components Service could be like this one

@Injectable()
class MyDataService implements IMyDataService  {
 
    private whenMessageRecieved$: Subject<MyDataType> =
        new ReplaySubject(1);
 
    constructor(
    ) {
    }
 
    public notify(someData: MyDataType): void {
        this.whenMessageRecieved$.next(someData);
    }
 
    public whenMessageRecieved(): Observable<MyDataType> {
        return this.whenMessageRecieved$.asObservable();
    }
}

ComponentB should subscribe to whenMessageRecieved() and componentA should call notify with strict params. In nearest future this service will help you migrate methods from componentB

But still - it would be better to store common logic somewhere else, not in componentB