Связь между соседними компонентами
 

Добрый день!
Подскажите как сделать связь между соседними компонентами?

В header есть форма поиска. И есть отдельная страница с результатами поиска. Если мы находимся на странице с результатами и запустим поиск, то результаты не обновляются (если поиск запускать с другой страницы, то поиск работает)

Форма поиска и результат поиска - это не дочерний и родительский компонент, поэтому декораторы input output не подойдут. Связь нужно делать видимо через сервис.

Сейчас код с результатом поиска такой

export class SearchResultComponent implements OnInit {

  private searchResult: any;

  constructor(private baseService: BaseService) { };

  ngOnInit(): void {
    this.searchResult = this.baseService.getHandlingResult();
    console.log('result', this.searchResult);
  }

}

В ngOnInit все будет выполняться только один раз при инициализации компонента. Что делать когда мы находимся на той же странице что и этот компонент, и данные нужно обновлять по событию из соседнего компонента

Пусть baseService.getHandlingResult() возвращает Observable. И у тебя будет в ngOnInit подписка.

Подскажите, пожалуйста, как это сделать.

Код класса для результатов поиска такой:

export class SearchResultComponent implements OnInit {

  private searchResult: any;

  constructor(private baseService: BaseService) { };

  ngOnInit(): void {
    this.baseService.getHandlingResult()
      .subscribe(res => {
        console.log('subscribe', res);
      });
  }

}

В сервисе такой код:

import { Observable } from 'rxjs';
...

@Injectable()
export class BaseService {
  constructor(private http: Http) { }

  private handling: any;

  getHandlingResult(): Observable<any> {
    return Observable.of(this.handling);
  }
...

Результат прежний: если поиск запускать на странице с результатами, то данные не обновляются. С других страниц поиск работает

tai,

import { BehaviorSubject } from 'rxjs/BehaviorSubject';
...

@Injectable()
export class BaseService {
  constructor(private http: Http) { }

  private handling: BehaviorSubject<any> = new BehaviorSubject(null);

  getHandlingResult() {
    return this.handling;
  }

  setResult(result) {
    this.handling.next(result);
  }
...

из компонента поиска нужно вызывать так this.baseService.setResult(result), где result - результат поиска.

Спасибо