Currently, I am in the process of establishing a connection between two components using a service: LoaderComponent and AppComponent with LoaderService. The goal is to display a loader whenever the application fetches data. However, when attempting to utilize an EventEmitter to broadcast changes to the components, they do not seem to receive these updates. Interestingly, the service is able to detect the changes when it subscribes to itself.
Here is the code for LoaderService.ts:
import { EventEmitter, Injectable } from '@angular/core';
@Injectable()
class LoaderService {
@Output change: EventEmitter<number> = new EventEmitter<number>();
private state: number = 0;
constructor() {
this.change.subscribe(state => console.log(state));
this.setState(1)
}
setState(state: number) {
this.state = state;
this.change.emit(this.state);
}
}
// The state is displayed within the service, but changes are not detected outside of it. Attempts were made with EventEmitter from events as well.
The expectation is to receive events from the LoaderService by its subscribers.