主页 / coding / 问题 / 79438678
Accepted
Raphaël Balet
Asked: 2025-02-14 15:55:10 +0800 CST

如何在新的 provideAppInitializer 中将 useFactory 与 deps 一起使用？

  • 772

我有以下代码，我希望首先初始化存储，然后初始化会话，然后您进入应用程序。

export function initApp(
  storage: StorageService,
  session: SessionService,
) {
  return async () => {
    await firstValueFrom(
      storage.initialized$.pipe(
        filter((event) => (event ? true : false)),
        take(1),
      ),
    )

    await firstValueFrom(
      session.initialized$.pipe(
        filter((event) => (event ? true : false)),
        take(1),
      ),
    )
  }
}

我曾经像下面这样实现它

{
  provide: APP_INITIALIZER,
  useFactory: initApp,
  deps: [StorageService, SessionService],
  multi: true,
},

但是使用最新的provideAppInitializer，我找不到为方法提供 deps 的方法。

看起来 Angular 团队已经改变了实现它的方式，如下useFactory所示：

provideAppInitializer(() => {
  const initializerFn = ((service: Service) => {
    return () => service.init();
  })(inject(Service));
  return initializerFn();
});

但我不知道该把我的依赖关系交给谁。

有人知道吗？

angular

1 个回答

  1. Best Answer

    只需注入并使用它。

    确保 init 方法返回一个承诺。

    provideAppInitializer(() => {
  const service: Service = inject(Service);
  return service.init();
});

    如果您希望初始化按顺序进行，则使用switchMap。

    provideAppInitializer(() => {
  const storage: StorageService = inject(StorageService);
  const session: SessionService = inject(SessionService);
  return firstValueFrom(
      storage.initialized$.pipe(
        filter((event) => (event ? true : false)),
        take(1),
        switchMap(() => {
          return session.initialized$.pipe(
            filter((event) => (event ? true : false)),
            take(1),
          )
        })
      ),
      
  );
});

    您可以将代码简化为：

    provideAppInitializer(() => {
  const storage: StorageService = inject(StorageService);
  const session: SessionService = inject(SessionService);
  return firstValueFrom(
    forkJoin([ 
      storage.initialized$.pipe(
        filter((event) => (event ? true : false)),
        take(1),
      ),
      session.initialized$.pipe(
        filter((event) => (event ? true : false)),
        take(1),
      ),
    ])
  );
});
    • 2

相关问题