Angular组件路由切换顺序导致ngOnDestroy触发异常的问题

以下是几种可能导致该异常的场景及排查方向：

• 路由复用策略的定制逻辑
  Angular的RouteReuseStrategy负责决定是否缓存路由组件实例。如果你的项目自定义了这个策略，或者在路由配置中针对组件A设置了复用规则，第一次进入A再切换到B时，A的实例可能被缓存保留，因此不会触发ngOnDestroy；而先进入B再切换到A时，缓存逻辑未生效，离开A时实例被正常销毁。可以检查RouteReuseStrategy的shouldReuseRoute、shouldAttach等方法实现，看是否对组件A有特殊处理。

• 组件被挂载到持久化容器
  如果组件A是通过手动方式（比如Renderer2、原生DOM操作）挂载到了document.body这类路由视图之外的全局容器，切换路由时Angular的视图树无法感知到该组件的存在，也就不会触发销毁钩子。比如某些自定义弹窗、侧边栏组件，若在第一次进入A时被添加到全局容器，切换到B时未手动移除，就会出现这种情况。

• 订阅未清理导致的引用持有
  组件A中若存在未取消的RxJS订阅（比如全局服务的流、interval定时器），且这些订阅持有组件实例的引用，会导致Angular无法正常销毁组件。如果这种订阅的逻辑和页面进入顺序相关——比如第一次进入A时订阅了一个持续发射的流，而先进入B时触发了全局的清理逻辑，再进入A时订阅被正确处理，就会出现触发不一致的情况。务必在ngOnDestroy中清理所有订阅，可使用takeUntil操作符统一管理。

• 路由守卫或配置的异常
  检查组件A的canDeactivate守卫，是否在第一次离开A时返回了阻止导航的逻辑（比如未完成表单校验），但后续状态变化后恢复正常？另外查看路由配置是否存在嵌套错误，导致第一次切换时组件A未被正确从视图树中移除。也可以排查全局路由事件监听逻辑，看是否在首次切换时干扰了组件销毁流程。

• 变更检测模式的特殊配置
  若组件A使用了ChangeDetectionStrategy.OnPush模式，第一次进入时输入属性的引用未发生变化，可能导致变更检测处于异常状态，间接影响组件销毁判断。不过这种场景相对少见，更多还是和组件挂载状态或缓存逻辑相关。

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