An abstract class named CoreButtonService has been created, which will serve as the base for other ButtonServices like UserButtonService and MessageButtonService. These services will be injected into corresponding components such as UserComponent and MessageComponent. In the constructor of CoreButtonService, a subscription to ButtonsService has been implemented to handle events triggered when buttons in the ButtonModule are clicked.
CoreButtonService:
export abstract class CoreButtonService<T extends CoreModel> extends CoreService {
private backSource = new Subject<string>();
private submitSource = new Subject<string>();
back$ = this.backSource.asObservable();
submit$ = this.submitSource.asObservable();
constructor(
private coreButtonsService: ButtonsService,
private coreLanguageService: LanguageService,
private coreLocation: Location) {
super(coreLanguageService);
this.coreButtonsService
.buttonClicked$
.subscribe(button => console.log(button)); // !!!!!!
}
// Additional button functionality goes here ...
}
ButtonsService:
@Injectable()
export class ButtonsService {
private button = new Subject<ButtonBase<any>>();
buttonClicked$ = this.button.asObservable();
constructor(private formService: FormService) { }
clickButton(button: ButtonBase<any>): void {
if (button.controlType === 'submit')
this.formService.submitForm(button.parent);
this.button.next(button);
}
}
When visiting a page with UserComponent and MessageComponent, clicking buttons should result in 2 logged buttons on the console - one for each component identifiable by button.parent
. However, only buttons from MessageComponent are being displayed instead of both. Upon saving the sent parent in CoreButtonService and logging it along with the button, correct values ('MessageForm' and 'UserForm') are obtained. Surprisingly, the values of button.parent
are identical. How can this discrepancy be explained?
The issue could potentially be due to every ButtonService subscribing within CoreButtonService, causing interrelated subscriptions and buttons.
UPDATE
For further reference, you can view the plunkr demonstrating the basic concept.