Angular 6 обновить компонент из сервиса

Question

Я использую Angular 6, и мне нужно обновить компонент, когда я вызываю сервисный метод. У меня есть переменная agent, которая удерживает выбранного агента из html, поэтому я получаю эту переменную из нескольких компонентов и могу удалить этого агента с определенной кнопки.
Когда я вызываю deleteAgent, мне нужно обновить интерфейс, чтобы мне нужно было сообщить компоненту, что агент был удален.

export class ComponentService {
  private agent : Agent
  constructor() { }

   /************ AGENT MANAGEMENT *****************/
   get getAgent(){
     return this.agent;
   }

   setAgent(agent: Agent){
     this.agent = agent;
   }

   deleteAgent(){
     this.agent = null;
     //inform the component about the change
   }
}

Я читал о ReplaySubject, но я не знаю, является ли это правильным способом и как удалить элемент. Вы можете мне помочь? Спасибо

Answer 1

Вы можете сохранить экземпляр агента в Observable и затем подписаться в компоненте на эту Observable.

export class ComponentService {
private _agent = Subject<Agent>();
constructor() { }

 /************ AGENT MANAGEMENT *****************/
 get agent(){
   return this._agent.asObservable();
 }

 set agent(agent: Agent){
   this._agent.next(agent);
 }

 deleteAgent(){
   this.agent = null;
 }
}

Answer 2

Я решил с этим кодом, я не знаю, является ли он лучшим кодом:

export class ComponentService {
  private agent: Agent;
  // Observable navItem source
  agentChange = new ReplaySubject<Agent>(1);

  constructor() { }

   /************ AGENT MANAGEMENT *****************/
   get getAgent(){
     return this.agent;
   }

   setAgent(agent: Agent){
     this.agent = agent;
   }

   deleteAgent(){
     this.agentChange.next(this.agent);
     this.agent = null;
   }
}

тогда в custroctor компонента у меня есть подписка и отмена подписки на метод уничтожения:

this.componentService.agentChange.subscribe((agent:Agent)=>{
     //on success instruction
    })

ngOnDestroy() {
    this.componentService.agentChange.unsubscribe();
  }