import { Component, OnInit, OnDestroy } from '@angular/core'; import { LoaderService } from './loader.service'; import { Subscription } from 'rxjs'; import { InProgressLoaderService } from './in-progress-loader.service'; @Component({ selector: 'esp-loader', templateUrl: './loader.component.html', styleUrls: ['./loader.component.scss'] }) export class LoaderComponent implements OnInit, OnDestroy { loaderSubscription: Subscription; inProgressLoaderSubscription: Subscription; showLoader: boolean; constructor( private loader: LoaderService, private inProgressLoaderService: InProgressLoaderService ) {} ngOnInit() { this.loaderSubscription = this.loader.showLoader().subscribe(show => { this.showLoader = show; }); this.inProgressLoaderSubscription = this.inProgressLoaderService .showLoader() .subscribe(show => { this.showLoader = show; }); } ngOnDestroy() { this.loaderSubscription?.unsubscribe(); this.inProgressLoaderSubscription?.unsubscribe(); } }