Angular PrimeNg how to chain confirmdialog

Question

I am using primeng ConfirmationService to display confirm dialog. After the first dialog is confirmed, i want to display another dialog based on a condition. But it is not working. Here is my code. Can anyone help me how to solve this?

this.confirmDialog.confirm({
    header: 'Begin',
    message: 'Are you sure you would like to start?',
    acceptLabel: 'Yes',
    rejectLabel: 'No',
    accept: () => {
        if(this.currentUserId !== workflow.assignedToId) {
            this.confirmDialog.confirm({
                header: 'Reassign',
                message: 'reassign it to yourself?',
                acceptLabel: 'Yes',
                rejectLabel: 'No',
                accept: () => {
                    console.log('accept 2 diffeent user');
                },
                reject: () => {
                    console.log('reject 2 diffeent user');
                }
            })
        } else {
            console.log('accept 1 same user');
        }
    },
    reject: () => {
        console.log('reject 1 same user');
    }
})

Answer 1

you need to create 2 confirmDialog with different key value:

<p-confirmDialog [style]="{ width: '50vw' }" [baseZIndex]="10000" key="confirm1"></p-confirmDialog>
<p-confirmDialog  [style]="{ width: '50vw' }" [baseZIndex]="10000" key="confirm2" ></p-confirmDialog>

and you need to add the key to the confirmationService function like this:

confirm1() {
    this.confirmationService.confirm({
      message: 'Are you sure that you want to proceed?',
      header: 'Confirmation',
      icon: 'pi pi-exclamation-triangle',
      key: 'confirm1',
      accept: () => {
        this.confirm2();
        this.msgs = [
          {
            severity: 'info',
            summary: 'Confirmed',
            detail: 'You have accepted',
          },
        ];
      },
      reject: () => {
        this.msgs = [
          {
            severity: 'info',
            summary: 'Rejected',
            detail: 'You have rejected',
          },
        ];
      },
    });
  }

  confirm2() {
    this.confirmationService.confirm({
      message: 'Do you want to delete this record?',
      header: 'Delete Confirmation',
      icon: 'pi pi-info-circle',
      key: 'confirm2',
      accept: () => {
        this.msgs = [
          { severity: 'info', summary: 'Confirmed', detail: 'Record deleted' },
        ];
      },
      reject: () => {
        this.msgs = [
          {
            severity: 'info',
            summary: 'Rejected',
            detail: 'You have rejected',
          },
        ];
      },
    });
  }

you can see an example on Stackblitz https://stackblitz.com/edit/primeng-confirmdialog-demo-v1x93e?file=src/app/app.component.ts