Angular 5:在Custom Decorator函数中使用Service

Oli*_*ent 4 javascript dependency-injection decorator typescript angular

我正在创建一个@Log()Decorator函数用于调试目的;

我希望Decorator将其中的一些逻辑委托给LoggingService依赖于应用程序中的其他服务...

我一直在尝试很多不同的东西,最简单/最直接的方法是将Main(或Shared)模块的Injector缓存为模块本身的静态prop(参见下面链接的StackBlitz示例),这对于懒惰 - 已加载的模块,但不适用于急切加载的模块......

非工作poc:https://stackblitz.com/edit/angular-j1bpvx file = app%2Fdecorator.ts

有没有办法在那里使用那个服务?

谢谢!

Est*_*ask 6

类装饰器在类定义上执行一次.为了避免竞争条件,AppModule.injector.get(LoggingService)它应该被移动到AppModule.injector已经定义的地方,即类方法.

应该是:

constructor.prototype[hook] = function (args) {
  const loggingService = AppModule.injector.get(LoggingService);

  loggingService.log({ ... })
  ...
Run Code Online (Sandbox Code Playgroud)

这也产生紧密耦合AppModule并防止单元重复使用或与其分开测试.建议使用另一个对象来保存injector属性,例如,injector不在main中分配,而是在导入到的子模块中分配AppModule:

export class InjectorContainerModule { 
  static injector: Injector;

  constructor(injector: Injector) {
    InjectorContainerModule.injector = injector;
  }
}
Run Code Online (Sandbox Code Playgroud)

  • 这个解决方案比我的好。 (2认同)