How To Get The Confirmation Service Of Primeng Wait For The Approval Or Denial Of The User?

How can I make the primng confirmation service behave equal to the browser native confirm? When a user clicks on a button, I need under certain conditions to request their confirma

Solution 1:

you can create a service as layer above primeng confirm service then use a promise as return type of custom confirm method that call primeng confirm service , the promise resolve as true for accept and false in case of reject.

confirm service

@Injectable({
  providedIn: "root"
})
exportclassConfirmService {
  constructor(private confirmationService: ConfirmationService) {}

  confirm({
    message = "Are you sure that you want to proceed?",
    header = "Confirmation",
    icon = "pi pi-exclamation-triangle"
  } = {}): Promise<boolean> {
    returnnewPromise(resolve => {
      console.log(
        this.confirmationService.confirm({
          message,
          header,
          icon,
          accept: () => {
            resolve(true);
          },
          reject: () => {
            resolve(false);
          }
        })
      );
    });
  }
}

we can use async/await because confirm method return promise

exportclassAppComponent {
  msgs: Message[] = [];

  constructor(private confirmService: ConfirmService) {}

  asyncconfirm() { 
    if (awaitthis.confirmService.confirm())
      this.msgs = [
        { severity: "info", summary: "Confirmed", detail: "You have accepted" }
      ];
    else {
      this.msgs = [
        { severity: "info", summary: "Rejected", detail: "You have rejected" }
      ];
    }
  }

}

stackblitz demo 🚀