时间戳

首页 > 解决方案 > 有没有办法在 AppModule 的提供者中动态设置模拟服务？

angular - 有没有办法在 AppModule 的提供者中动态设置模拟服务？

问题描述

我的 AppModule 定义有一个非常简单的设计。我的提供程序中有一组模拟服务，它利用本地数据，直到我的端点可以得到解决。随着服务端点的建立，我正在慢慢地将它们迁移过来。问题是应用程序非常需要一些配置来启动和运行端点，所以我创建了一个简单的配置文件，它创建了一个属性： useMockedServices供想要使用演示的人使用。

{
  useMockedServices: true
}

但是，我的问题是。我如何为提供商考虑此配置？

...
providers: [
  {provide: UserService, useClass: MockUserService},
  ...
],
...

我可以做类似的事情：

providers: [
  { provide: MAT_DIALOG_DEFAULT_OPTIONS, useValue: { hasBackdrop: false }},
  ...
].concat( config.useMockedServices ? [
  {provide: UserSerice, useValue: MockUserService},
  ...
]: [],

我试图这样做，但我得到一个错误：没有重载匹配这个调用，它说“属性切片的类型不兼容”

providers: [
    // Default Options for using Modals / Dialogs.
    { provide: MAT_DIALOG_DEFAULT_OPTIONS, useValue: { hasBackdrop: false } },
    { provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true },
    { provide: HTTP_INTERCEPTORS, useClass: ErrorInterceptor, multi: true },
    { provide: AuthGuard, useClass: AuthGuard },
    { provide: AuthenticationService, useClass: AuthenticationService }
  ].concat(
    configuration.useMockServices === true ? [
    { provide: UserService, useClass: MockUserService },
    ...
    ] : []
  ),
...

标签： angulartypescript

解决方案

你可以用它useFactory来做到这一点：

function userServiceFactory() {
   return enviroment.useMockedServices ? UserServiceMock : UserService;
}


...

providers: [
  {provide: UserService, useFactory: userServiceFactory},
  ...
]

或者，如果您将配置投入使用。

function userServiceFactory(config: ConfigService) {
   return config.useMockedServices ? UserServiceMock : UserService;
}


...

providers: [
  {provide: UserService, useFactory: userServiceFactory, deps:[ConfigService]},
  ...
]

推荐阅读