Связь между функциями компонентов различных модулей

Question

У меня двухкомпонентный ComponentA и ComponentB. Эти двухкомпонентные объявлены в разных модулях. Теперь я хочу, чтобы функция ComponentA вызывалась из ComponentB. Этот двухкомпонентный компонент не имеет отношений родитель-потомок.

export class ComponentA{
 randomfun(){
 console.log('random function entered');
 }
}

constructor(private comA: ComponentA){}
export class ComponentB{
// calling component A function
comA.randomfun();
}

Этот код привел к StaticInjectorError (AppModule) [ComponentB -> ComponentA]

Answer 1

Вы можете достичь этого, используя shared singleton service:

  @Injectable({
      providedIn: 'root'
    })
    export class SharedService {
        private _invokeSource: Subject<void> = new Subject<void>();
        public invokeObservable: Observable<void> = this._invokeSource.asObservable();
        public invoke(): void {
            this._invokeSource.next();
    }
    }

компонент A:

[...] this.sharedService.invoke();

компонент B:

[...]

private _subscription: Subscription;
this._subscription = this.sharedService.invokeObservable.subscribe(() => this.randomfun())

Кроме того, чтобы избежать утечек памяти, вы должны отказаться от подписки на настраиваемую наблюдаемую во время ngOnDestroy():

public ngOnDestroy(){
    this._subscription.unsubscribe();
}

Демо: https://stackblitz.com/edit/angular-shared-service-invoke

Обратите внимание, что если компонент, для которого вы пытаетесь вызвать метод, не загружен в dom, это не сработает. В этом случае вам нужно будет создать экземпляр класса компонента и вызвать для него метод (хотя я бы никогда не рекомендовал это делать).