如何复用确认对话框代码，仅修改消息内容无需新增函数？

完全可以实现，不用重复写对话框代码，只需要通过动态绑定内容来复用同一套组件，具体步骤如下：

1. 在组件类中定义动态数据变量 #

在你的组件.ts文件里，添加控制对话框显示状态和内容的变量：

// 控制对话框的显示/隐藏
isConfirmDialogVisible = false;
// 存储对话框的标题和内容
confirmDialogData = {
  title: '',
  message: ''
};

2. 重构为单一复用的对话框组件 #

把原来的两个p-dialog合并成一个，通过插值语法绑定动态数据：

<p-dialog [(visible)]="isConfirmDialogVisible" [style]="{ width: '50vw' }" modal="true" [closable]="false">
  <ng-template pTemplate="header">
    <h3>{{ confirmDialogData.title }}</h3>
  </ng-template>
  <p>{{ confirmDialogData.message }}</p>
</p-dialog>

3. 触发不同场景的对话框 #

在需要弹出对话框的地方，只需要给confirmDialogData赋值对应的标题和内容，再打开对话框即可，不需要写新的对话框函数：

// 触发ABC标签确认对话框
openABCConfirm() {
  this.confirmDialogData = {
    title: 'Confirm ABC?',
    message: 'Are you sure you want to tag as ABC?'
  };
  this.isConfirmDialogVisible = true;
}

// 触发公司包含确认对话框
openIncludeCompanyConfirm() {
  this.confirmDialogData = {
    title: 'Confirm include the company?',
    message: 'Are you sure you want to include the company? This will include the sub unit.'
  };
  this.isConfirmDialogVisible = true;
}

扩展：支持确认/取消按钮（可选） #

如果需要添加确认和取消按钮，也可以把按钮的文本和回调逻辑放进动态数据里，进一步提升复用性：

// 扩展后的对话框数据
confirmDialogData = {
  title: '',
  message: '',
  confirmText: 'Confirm',
  cancelText: 'Cancel',
  onConfirm: () => {},
  onCancel: () => {}
};

对应的对话框模板添加按钮：

<p-dialog [(visible)]="isConfirmDialogVisible" [style]="{ width: '50vw' }" modal="true" [closable]="false">
  <ng-template pTemplate="header">
    <h3>{{ confirmDialogData.title }}</h3>
  </ng-template>
  <p>{{ confirmDialogData.message }}</p>
  <ng-template pTemplate="footer">
    <button pButton type="button" label="{{ confirmDialogData.cancelText }}" (click)="handleCancel()"></button>
    <button pButton type="button" label="{{ confirmDialogData.confirmText }}" (click)="handleConfirm()"></button>
  </ng-template>
</p-dialog>

组件类里添加按钮处理逻辑：

handleConfirm() {
  this.confirmDialogData.onConfirm();
  this.isConfirmDialogVisible = false;
}

handleCancel() {
  this.confirmDialogData.onCancel();
  this.isConfirmDialogVisible = false;
}

// 触发时传入回调
openABCConfirm() {
  this.confirmDialogData = {
    title: 'Confirm ABC?',
    message: 'Are you sure you want to tag as ABC?',
    onConfirm: () => {
      // 这里写ABC确认后的逻辑
      console.log('Tagged as ABC');
    },
    onCancel: () => {
      // 这里写取消后的逻辑
      console.log('Canceled');
    }
  };
  this.isConfirmDialogVisible = true;
}

内容的提问来源于stack exchange，提问作者Pinky