Angular 17函数式守卫inject()每次注入新服务实例问题

你的问题核心是：标记为providedIn: 'root'的UiService本该是全局单例，但在CanActivateFn函数式守卫每次执行时，注入的都是新实例。结合你提供的代码和描述，下面是排查和解决的思路：

排查方向 #

1. 检查是否重复提供服务
   虽然你说服务没在任何providers数组中声明，但务必全局搜索项目代码，确认没有在任何模块（尤其是懒加载模块）的providers里添加UiService。如果懒加载模块的providers中声明了该服务，Angular会为这个模块创建独立的服务实例，导致守卫（如果属于该模块路由）拿到的是模块级实例，而非根注入器的单例。

2. 验证服务实例一致性
   在AppComponent中注入UiService并打印serviceInstance值，同时在守卫中也打印该值：

   // AppComponent.ts
   constructor(private uiService: UiService) {
     console.log('AppComponent实例:', this.uiService.serviceInstance);
   }
   
   // 守卫中
   const uiServiceVersion = uiService.serviceInstance;
   console.log('守卫实例:', uiServiceVersion);
   

   如果两个值不同，说明确实存在多个服务实例，此时重点排查模块的providers配置。

强制获取根注入器单例 #

如果排查后仍无法找到重复提供的位置，可以在守卫中通过根注入器强制获取单例实例：

const myAppGuard: CanActivateFn = (route, state) => {
  const injector = inject(Injector);
  // 跳过当前注入器，直接从根注入器获取服务
  const uiService = injector.get(UiService, undefined, { skipSelf: true });
  
  const router = inject(Router);
  const appInit = uiService.appInit;
  
  if (!appInit) {
    uiService.appInit = true;
    return router.createUrlTree(["/home"]);
  } else {
    return router.createUrlTree(["/browserclose"]);
  }
};

额外注意点 #

• 确保你的Angular版本没有已知的函数式守卫注入bug（建议使用最新稳定版）。
• 检查是否在路由配置中使用了withComponentInputBinding()等可能改变注入上下文的配置，不过这类配置通常不会影响服务单例。

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