Angular5 манипулирование Html другого компонента, не имея дочерних / родительских отношений

Question

Для моего приложения мне нужно общаться с 2 компонентами, но эти компоненты не имеют родительских и дочерних отношений.

Я использую сервис для настройки этого сообщения.Когда я нажимаю на кнопку компонента 1, я запускаю функцию в compenent2.Обычно эта функция вносит изменения в html component2, когда я запускаю его из component2.Но когда я запускаю его из component1, ничего не происходит.Есть ли способ перезагрузить / обновить HTML, когда component1 вызывает функцию в component2?

THx много!

Answer 1

Должна быть проблема с вашим сервисом связи, насколько я использовал, у меня работало нормально.Убедитесь, что вы подписываетесь на сервис в конструкторе компонента, в котором вы хотите получить любое значение.В вашем случае

 import { Subject,Observable, of } from 'rxjs';
 code for service :
   public methodForRender = new Subject<any>();
   renderMe = this.methodForRender.asObservable();
   callMethodToRender(value) {
    this.methodForRender.next(value);
   }

 code for component 1 :  which is triggering function!

   constructor(private callingBridge: SharedService) {}
   this.callingBridge.callMethodToRender(this.value);

 code for component 2 :  which should be subscribed to service 

    constructor(private callingBridge: SharedService) {}
    this.callingBridge.renderMe.subscribe(
     (value) => {
        // do your stuff // call your function here to render html
       }
    );    

Надеюсь, это вам поможет!