I have implemented a messageBox functionality using p-toast. When a user clicks on delete, they are prompted with a yes or no option before hitting the API to delete the item. The issue I am facing is that if I click on the delete button for one item, select no, and then proceed to delete a different item by clicking yes, both the first and second items get deleted. I only want to delete the current item being clicked.
messagebox.service.ts:
public messageSource = new BehaviorSubject(false); currentMessage =
this.messageSource.asObservable();
public _msgBoxSubject: EventEmitter<boolean> = new
EventEmitter<boolean>(); public confirmResponse: boolean = false;
response: boolean = false;
show() {
this.messageSource.next(false);
this.response = true;
this._msgBoxSubject.emit(this.response); }
onYes(value) {
this.messageSource.next(value);
this.confirmResponse = value; }
onNo(value1) {
this.confirmResponse = value1; }
hide() {
this.response = false;
this._msgBoxSubject.emit(this.response); }
getMsgBoxEmitter() {
return this._msgBoxSubject; }
messagebox.component.ts:
ngOnInit() {
this._msgBoxService.getMsgBoxEmitter().subscribe((value: boolean) => {
this.messageService.clear();
this.messageService.add({ key: 'c', sticky: true, severity: 'warn', summary: 'Are you sure?', detail: 'Confirm to proceed' });
}); }
onConfirm() {
this.messageService.clear('c');
this._msgBoxService.onYes(true); }
onReject() {
this.messageService.clear('c'); }
emailmaster.component.ts: (I am calling this function on delete button click)
deleteEmail(ID: Email) {
this._msgBoxService.show();
this._msgBoxService.currentMessage.subscribe(response1 => {
if (response1 === true) {
this._masterservice.deleteEmail(ID).subscribe(data => {
this._toasterService.showMessage('Email deleted successfully', 'Success Message', 'success');
if (data) {
this.GetEmails();
}
});
}
});
}
I need to ensure that only the current item is deleted when the user clicks yes in the messagebox prompt.