本文详解在前端调用 rest api 时，如何通过 rxjs 订阅链式处理实现「删除公司时自动级联删除其所有分支机构」，并妥善处理无分支、网络错误等边界情况。
本文详解在前端调用 rest api 时，如何通过 rxjs 订阅链式处理实现「删除公司时自动级联删除其所有分支机构」，并妥善处理无分支、网络错误等边界情况。
在实际企业级应用中，数据存在强关联性——例如一个公司（Company）可拥有多个分支机构（Branch），且 Branch 表通过 companyId 外键关联到 Company。当用户执行“删除公司”操作时，业务逻辑要求必须先清除所有依赖该公司的分支机构，再删除公司本身；否则将违反数据库约束或导致数据不一致。
直接并行发起两个 delete 请求（如原代码中 this.repository.deleteCompany(...) 和 this.repository.deleteBranch(...) 独立调用）存在严重风险：
- ❌ 竞态问题：公司可能先被删，而分支删除请求因延迟仍在执行，导致 404 或外键冲突；
- ❌ 错误掩盖：任一请求失败均无法感知，用户误以为删除成功；
- ❌ 资源泄漏：若分支删除失败但公司已删，将产生孤立分支数据。
✅ 正确做法是采用串行化、错误感知的级联删除流程，核心原则为：
- 先删子集（Branches），再删主体（Company）；
- 显式捕获 HTTP 404（表示无关联分支），视为合法成功路径，继续删除公司；
- 对其他错误（500、网络超时等）进行日志记录与降级提示，保障用户体验。
以下是优化后的 TypeScript 实现（基于 Angular + RxJS）：
deleteCompany(id: number): void {
console.log('Attempting to delete company with ID:', id);
// 第一步：尝试删除所有关联分支
this.repository.deleteBranch(`addBranchToCompany?companyId=${id}`).subscribe({
next: () => {
console.log('All branches associated with company deleted successfully.');
// 分支删除成功 → 继续删除公司
this.deleteCompanyCore(id);
},
error: (err) => {
if (err.status === 404) {
console.warn('No branches found for company ID:', id, '. Proceeding to delete company only.');
this.deleteCompanyCore(id);
} else {
console.error('Failed to delete branches:', err);
this.showErrorToast('删除分支机构失败，请稍后重试');
}
}
});
}
// 提取公共删除逻辑，避免重复代码
private deleteCompanyCore(id: number): void {
this.repository.deleteCompany(`addCompany/${id}`).subscribe({
next: () => {
console.log('Company deleted successfully.');
this.getCompanies(); // 刷新列表
this.showSuccessToast('公司已成功删除');
},
error: (err) => {
console.error('Failed to delete company:', err);
this.showErrorToast('删除公司失败，请检查网络或联系管理员');
}
});
}? 关键设计说明：
- 使用 subscribe({ next, error }) 对象语法替代回调函数，提升可读性与可维护性；
- 将公司删除逻辑封装为 deleteCompanyCore()，消除重复订阅逻辑；
- 对 404 错误主动识别并降级处理（非异常），符合 RESTful 设计规范；
- 前端增加用户反馈（showSuccessToast/showErrorToast），避免静默失败。
⚠️ 注意事项：
- 后端 API 必须支持按 companyId 批量删除分支（如 DELETE /api/addBranchToCompany?companyId=1），且返回标准 HTTP 状态码；
- 若分支数量极大（>1000 条），建议后端改为软删除或异步任务，前端轮询状态，而非阻塞等待；
- 生产环境应添加防重复点击（如按钮置灰 + takeUntil）、请求取消机制（AbortSignal 或 Subject）以提升健壮性。
通过以上实现，你不仅解决了级联删除问题，更构建了一套可复用、可观测、高容错的数据清理模式。
