Скрыть компонент от любого активного компонента?

Question

Есть компонент <app-tabs-components>.

Получает данные от сервиса. В этой службе есть переменная show: boolean для показа / скрытия компонента на странице.

@Injectable({ providedIn: "root" })
export class TabService {
    show = false;
    showHide(status: boolean) { 
        this.show = status;
    }

     get() {
          return this.show;
     }
}

Проблема в том, что мне нужно вызывать tabService.showHide(false) в каждом компоненте, где я хочу скрыть компонент <app-tabs-components>.

Компонент <app-tabs-components> всегда должен быть закрыт, если он потерял фокус, а не активную область.

В моем случае я нарушаю принцип DRY.

Например, когда Пользователь активирует любой компонент, который я должен сделать:

ngOnInit() {
  tabService.showHide(false)
}

Таким образом, эта часть кода повторяется в каждом компоненте, где я хочу скрыть tabsComponent

Answer 1

Создайте базовый класс и в конструкторе этого класса вызовите свой сервис.

export class BaseComp  {

  public IsHide: boolean;
  constructor() {
    this.IsHide = tabService.showHide(false);
  }

}

Унаследуйте этот BaseComp в разных компонентах.

export class YourComponent extends BaseComp implements OnInit  {

constructor() {
  super(); // calls the base constructor 
  console.log(this.IsHide); // this IsHide is of Base class
}

ngOnInit() {

}

}

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