Почему пропадает подписка на переменную Observeble (Subject) в Angular?

Question

[atmk]

В сервисе создана переменная varServ$. Ее значение задается из вне через setVar() (может задаваться из любого компонента).
export class MyService {
varServ$ = new Subject();
}
setVar(sss: number){
this.varServ$.next(sss);
}

В первом компоненте я подписываюсь на эту переменную (на varServ$),
Отображаю ее в форме.
Здесь все работает. При изменении varServ$ из вне изменяется varComp1 и изменяется отображение varComp1.
export class MyComponent1 implements OnInit {
varComp1: number;
constructor(
private myService: MyService,
) { }
ngOnInit() {
this.myService.varServ$.subscribe(x => this.varComp1 = x);
}
HTML:
Переменная - {{varComp1}}

Мне нужно во втором компоненте показывать и прятать первый компонент.
export class MyComponent2 implements OnInit {
viewForm=true;
}
HTML:
Показать
Спрятать
ПРОБЛЕМА И ВОПРОС.
При первоначальном отображении второго (и в нем первого) компонента переменная varComp1 отображается.
Но, если (во втором компоненте) СПРЯТАТЬ и снова ПОКАЗАТЬ первый компонент, то переменная varComp1 первого компонента пропадает.

Почему пропадает значение первого компонента varComp1, если есть подписка в первом компоненте на varServ$ и значение varServ$ раньше было задано и не изменялось.

Если по новой (из вне) задать значение varServ$ (через next), то varComp1 естественно появится, а при спрятать/показать опять пропадает.

Comments

[Alex]

Как скрываете 1й компонент?

Answer 1

[Дмитрий Еремин]

когда прячете, 1й компонент уничтожается?

Добавьте компоненту интерфейс OnDestroy и реализуйе метод

ngOnDestroy(): void {
   console.log('destroyed')
}

Если срабатывает, то, думаю, нужно просто отписывать при уничтожении
reactivex.io/rxjs/class/es6/Subscription.js~Subscr...