Question

来自Java背景，我很难理解Angular的一些内容，特别是依赖注入机制。这与我以前的情况完全不同。现在我正试图了解如何将配置变量注入我正在创建的服务中：

@Injectable()
export class MyBackendService {
    constructor(url: string, version: string, token: string, secret: string) { }
}

所有这些字符串都存储在我的environment.{env}.ts文件中。但我不知道如何告诉Angular获取这些变量并注入我的服务类。有没有人对这种惯用方法有任何提示？

Answer 1

为了从Angular DIC中注入依赖项，应该在其中注册依赖项。

在DIC中注册可注入实体的方法是通过 @NgModule 。然后从使用它的模块中导入这个。

为了向DIC注册服务或值，它应该位于NgModule的providers数组中。

在这个具体的例子中（如果你需要将它添加到DIC）我宁愿将配置值注入 BackendService ，其中包含从配置文件获取的该服务所需的所有数据应用程序：

1 配置

配置模块

import { NgModule } from '@angular/core';
import { CONFIG } from "...";

@NgModule({
    providers: [
        { provide: CONFIG, useValue: CONFIG }
    ]
})
export class ConfigModule{}

配置值

export const CONFIG = {

     endpoint: {
        service1: {
            url: 'http://api.your-app.com/service1/',
            withCredentials: true,
            ...
        },
    }
}

2 服务（配置的使用者）

模块：

import { NgModule } from '@angular/core';
import { Service1 } from "...";
import { CONFIG } from "...";
import { ConfigModule } from "...";

@NgModule({
    imports: [
        ConfigModule // Import the config module to make the config available for the services in this module
    ]
    providers: [
        { 
            provide: Service1 // Register your service in the DIC the one that performs the requests to that server endpoint,
            useFactory: (config) => new Service1(config),
            deps:[ 
                CONFIG 
            ]
        }
    ]
})
export class ApiModule{}

<强>服务

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

export class Service1{

    private _endpointUrl:string;

    constructor(config) {
        this._endpointUrl = config.endpoint.service1.url;
    }
}

3 使用服务1的应用模块

    import { NgModule } from '@angular/core';
    import { ApiModule } from "...";

    @NgModule({
        imports: [
            ApiModule
        ]
        ...
    })
    export class AppComponent{}

那么你的注射链就是

AppComponent <- Service1 <- CONFIG

所有这些都假定我们希望配置是可注入的

但

我们真的需要注入配置吗？

一般情况下，配置只是一个JSON结构，它用作应用程序消耗的常量，在这种情况下，我只需要使用typescript import导入它并避免添加它到DIC。例如：

<强>服务
```
import {CONFIG} from '...';

export class Service1{

    private config;

    constructor() {
        this._config = CONFIG;
    }
}
```
稍后如果需要从可以使用您的应用程序中使用的模块加载器（SystemJS，Webpack ...）解决的端点加载。

如果您想在不重新加载浏览器的情况下更新应用程序配置，则会出现这种情况，在我看来，配置值应该由DIC提供的配置服务提供

希望这有帮助。

处理Angular 2 DIC中的服务配置

1 个答案: