0

我来自 c# 背景。我是 Angular 6 的新手。我了解到对于 DI 有类似于 ninject 的库。反转。我试图在应用程序中使用它。

我确实配置了绑定和类型。

类型.ts

const TYPES = {
    IAppService : Symbol.for("IAppService")
};

export {TYPES}

绑定.ts

import 'reflect-metadata';
import { Container } from "inversify"
import { TYPES } from "./TYPES"
import { IAppService } from "./services/IAppService"
import { AppService } from "./services/AppService"


const inversifyContainer = new Container();
inversifyContainer.bind<IAppService>(TYPES.IAppService).to(AppService).inSingletonScope();

export { inversifyContainer };

还有我正在注入 APPService 的班级

    import { inject } from "inversify";
    import { Component, OnInit } from '@angular/core';
    import { AppModel } from './model/AppModel'
    import { IAppService } from './services/IAppService';
    import { TYPES } from "./TYPES";


    @Component({
        selector: 'summary-app',
        templateUrl: './summary-app.component.html'
    })
    export class SummaryApp implements OnInit {

        private _service: IAppService;

        constructor(
            @inject(TYPES.IAppService) service: IAppService,
        ) {
            this._service = service;
        }
}

模块.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppService } from "./services/AppService"
import { SummaryApp } from './summary-app.component';

@NgModule({
  declarations: [
    SummaryApp
  ],
  imports: [
    BrowserModule
  ],
  providers: [
    AppService
  ],
  bootstrap: [SummaryApp]
})
export class AppModule {
}

编译成功。但我得到运行时错误Can't resolve all parameters for SummaryApp

这意味着 inversify 无法解决依赖关系。我看到很多例子,人们使用服务定位器解决了依赖问题。但我觉得它的反模式。我在哪里可以得到 inversify 容器的组合根?

4

1 回答 1

0

是否SummaryApp通过容器实例化?如果不是这样,我们就不是最好的情况。我看到两种不同的解决方案:

  1. 尝试SummaryApp通过 inversify 容器实例化(我不是 Angular 专家,所以我不知道如何完成这样的壮举)
  2. 使用@lazyInject
import getDecorators from "inversify-inject-decorators";

import { container } from 'your-container-module';

const { lazyInject } = getDecorators(container); // Export your inversify container

@Component({
    selector: 'summary-app',
    templateUrl: './summary-app.component.html'
})
export class SummaryApp implements OnInit {

    private _service: IAppService;

    constructor(
        @lazyInject(TYPES.IAppService) service: IAppService,
    ) {
        this._service = service;
    }
}


此装饰器使用代理来执行对 inversify 容器的调用。这应该可以工作,除非您的捆绑器在 inversify 放置代理后重新定义属性(有关更多详细信息,请参阅此问题

于 2021-04-25T08:22:31.347 回答