Angular独立应用中模块初始化代码的实现方案（支持懒加载）

以下是几种无需依赖NgModule的解决方案，实现类似模块构造函数的懒加载初始化效果：

1. 懒加载路由回调中直接执行初始化 #

这是最直接的方案，利用路由loadChildren的导入回调时机，在返回路由配置前执行初始化代码：

const routes: Routes = [
  {
    path: 'lazy',
    loadChildren: () => import('./lazy/lazy.routes').then((m) => {
      // 在这里执行初始化逻辑，比如组件全局配置
      NgSelectModule.forRoot({
        notFoundText: '无匹配选项',
        // 其他配置项
      });
      return m.LAZY_ROUTES;
    }),
  },
];

• 优点：初始化逻辑与懒加载路由强绑定，仅在路由首次加载时执行一次（ES模块导入会被缓存），完全对应模块构造函数的执行时机。
• 注意：如果初始化逻辑依赖服务，需确保服务已在独立应用的注入器中提供。

2. 使用路由守卫（CanMatch/CanActivate）控制初始化 #

创建一个守卫类，在路由匹配或激活时执行初始化，同时通过状态标记避免重复执行：

@Injectable({ providedIn: 'root' })
export class LazyInitGuard implements CanMatch {
  private isInitialized = false;

  constructor(private someService: SomeService) {}

  canMatch(): boolean | Observable<boolean> | Promise<boolean> {
    if (!this.isInitialized) {
      // 执行初始化逻辑
      this.someService.init();
      this.isInitialized = true;
    }
    return true;
  }
}

// 在路由配置中使用
const routes: Routes = [
  {
    path: 'lazy',
    loadChildren: () => import('./lazy/lazy.routes').then(m => m.LAZY_ROUTES),
    canMatch: [LazyInitGuard],
  },
];

• 优点：初始化逻辑与路由解耦，可复用在多个懒加载路由上；CanMatch会在路由匹配阶段触发，早于组件初始化，更贴近模块构造函数的执行时机。
• 注意：需确保守卫是单例（providedIn: 'root'），避免重复初始化。

3. 懒加载入口组件的ngOnInit中执行 #

将初始化逻辑放在懒加载路由的入口组件的ngOnInit中，配合单例服务标记初始化状态：

// 单例服务用于标记初始化状态
@Injectable({ providedIn: 'root' })
export class LazyInitService {
  isInitialized = false;
}

// 懒加载入口组件
@Component({
  selector: 'app-lazy',
  standalone: true,
  template: '<router-outlet></router-outlet>',
})
export class LazyEntryComponent implements OnInit {
  constructor(private initService: LazyInitService) {}

  ngOnInit(): void {
    if (!this.initService.isInitialized) {
      // 执行初始化逻辑
      this.initService.isInitialized = true;
    }
  }
}

• 优点：无需额外守卫或修改路由回调，利用组件生命周期自然触发。
• 缺点：初始化时机晚于路由匹配，且若入口组件被多次实例化（懒加载路由通常只会实例化一次），需依赖单例服务避免重复执行。

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