在角度10中使用异步服务方法作为工厂提供者

如何解决在角度10中使用异步服务方法作为工厂提供者

我正在使用Angular 10开发一个应用程序，在将应用程序显示给用户之前，我必须执行各种初始化操作。

我是Angular和Typescript的新手，我正在尝试根据通过谷歌搜索网络找到的样本来做到这一点。

到目前为止，我已经做到了这一点，应该使应用程序在启动前等待10秒钟，但仍无法正常工作。

我用以下代码创建了一个AdminutilsService：

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})

export class AdminutilsService {

  constructor() { }

  loadCustomerConfig(): (() => Promise<boolean>) {
    return (): Promise<boolean> => {
      return new Promise<boolean>((resolve: (a: boolean) => void): void => {
        setTimeout(() => resolve(true),10000);
      });
    };
  }

}

在app.module.ts中，我添加了：

import { AdminutilsService } from './adminutils.service';
export function loadCustomerConfigFactory(myAdminutilsService: AdminutilsService) {
     return () => myAdminutilsService.loadCustomerConfig();
}

以及@NgModule：

  providers: [{
    provide: APP_INITIALIZER,useFactory: loadCustomerConfigFactory,deps: [AdminutilsService],multi: true
  }],

编译完成了，因为我只有一个警告

export function loadCustomerConfigFactory(AdminutilsService: AdminutilsService) {

预期的呼叫签名：“ loadCustomerConfigFactory”具有typedef（typedef）

但是当我启动该应用程序时，没有预期的10秒延迟。

请告知。

解决方法

您使它变得比必需的复杂得多。

下面的简化代码应该可以工作：

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})
export class AdminutilsService {
  loadCustomerConfig(): Promise<boolean> {
    return new Promise<boolean>(resolve => {
      setTimeout(() => resolve(true),10000);
    });
  }
}

在app.module.ts中：

import { AdminutilsService } from './adminutils.service';

export function loadCustomerConfigFactory(myAdminutilsService: AdminutilsService) {
  return () => myAdminutilsService.loadCustomerConfig();
}

我还设置了一个StackBlitz进行演示。 “加载”显示10秒钟，直到Angular应用程序初始化。