为什么我的属性注入尝试除了未定义之外没有注入任何内容？

Question

我有一个使用 inversify 的现有打字稿项目。我已经在我的 TYPES 中定义了一个记录器，TYPES.ILoggger当我直接从我的容器访问记录器时，它可以工作：

import {ILogger} from "./interfaces/ILogger";
import {TYPES} from "./interfaces/TYPES";
import container from "./kernel/inversify.config";

const loggerFromTheContainer: ILogger = container.get<ILogger>(TYPES.ILogger);
loggerFromTheContainer.info("I WILL LOG"); // this works

所以我的设置应该没问题。

我不想直接访问容器，但我想使用属性注入。[InversifyJS' README提供了一个例子：

如果你喜欢它，你可以使用属性注入而不是构造函数注入，这样你就不必声明类构造函数：

@injectable()
class Ninja implements Warrior {
    @inject(TYPES.Weapon) private _katana: Weapon;
    @inject(TYPES.ThrowableWeapon) private _shuriken: ThrowableWeapon;
    public fight() { return this._katana.hit(); }
    public sneak() { return this._shuriken.throw(); }
}

我试着遵循那个。

然而，当我尝试通过属性注入来注入记录器时，我突然undefined变成了一个记录器，我不知道为什么：

@injectable()
class ShouldHaveLogger {
    @inject(TYPES.ILogger) private logger: ILogger;

    constructor() {
        this.logger.info("Hello World"); // this.logger will remain undefined
    }
}

new ShouldHaveLogger();

它会抛出一个泛型

TypeError: Cannot read property 'info' of undefined

因为this.logger没有被注射。然而，为什么以及如何解决它？

Answer 1

属性注入的正常行为是让inversify您为您创建实例。您现在正在描述一个用例，在该用例中您创建ShouldHaveLogger自己的实例（或另一个库正在为您创建它）。

文档也指出了这一点

为了做到这一点，你需要inversify-inject-decorators，然后你可以注入记录器，例如通过@lazyInject。

您必须使用您的容器设置 lazyInject，您的代码应如下所示：

import {injectable} from "inversify";
import getDecorators from "inversify-inject-decorators";
import {ILogger} from "./interfaces/ILogger";
import {TYPES} from "./interfaces/TYPES";
import container from "./kernel/inversify.config";   

const {lazyInject} = getDecorators(container);

@injectable()
class ShouldHaveLogger {
    @lazyInject(TYPES.ILogger) private logger: ILogger;

    constructor() {
        this.logger.info("I am working now");
    }
}

new ShouldHaveLogger();

将根据您的记录器实现打印：

2019-01-30T09:47:54.890Z - info: "I am working now"