Angular2中的组件还需要导入共享服务吗？

Question

我有一些设置需要在我的 Angular 2 应用程序中可用。我了解处理此问题的最佳方法是通过服务提供这些值，确保将服务注入 bootstrap() 方法。

所以我的服务（init.service.ts）是这样的：

import {Injectable} from 'angular2/core';

@Injectable()
export class InitService {
    public static startNodeIdContent:number = 1053;
    public static startNodeIdMedia:number = 9999;
}

那么我的bootstrap方法是这样的：

import {bootstrap}          from 'angular2/platform/browser'
import {ROUTER_PROVIDERS}   from 'angular2/router';
import {AppComponent}       from './app.component'
import {RouteNames}         from './services/route-names.service';
import {InitService}        from './services/init.service';

bootstrap(AppComponent, [ROUTER_PROVIDERS,RouteNames,InitService]);

现在，我需要使 startNodeIdContent 值在组件中可用，如下所示：

import { Component }                    from 'angular2/core';
import { HTTP_PROVIDERS }               from 'angular2/http';
import { provide }                      from 'angular2/core';
import { Router }                       from 'angular2/router';
import { XHRBackend }                   from 'angular2/http';

import { RouteNames }                   from '../services/route-names.service';
import { ContentNode }                  from './content-node';
import { ContentService }               from './content.service';
import { ContentTreeComponent }         from './content-tree.component';
import { ContentDashboardComponent }    from './content-dashboard.component';

@Component({
    selector: 'my-dashboard',
    template: `
        <div class="tree-panel-container">
            <div class="tree-panel-content">
                <content-tree [startNodeId]="startNodeIdContent"></content-tree>
            </div>
        </div>
        <content-dashboard></content-dashboard>
    `,
    directives: [ContentTreeComponent, ContentDashboardComponent],
    providers: [
        HTTP_PROVIDERS,
        ContentService
    ]
})

export class ContentComponent {
    constructor(private _routeNames:RouteNames, InitService){
        _routeNames.name.next('Content');
    }
    startNodeIdContent = InitService.startNodeIdContent;
}

但是，我发现在此组件中，InitService 未被识别。我是否仍必须将 InitService 服务导入到使用它的每个组件中？我的一部分认为将它注入 Bootstrap 方法应该为我做这件事，但我从文档中不确定这应该如何工作。

谢谢。

Answer 1

类型名称只是一个无意义的字符串，除非它直接连接到使用导入声明它的文件。您的应用程序可以包含或导入无限数量的同名 classes。导入明确了 class 类型指的是什么。

导入和 providing/injecting 大部分是不相关的概念。

导入是让当前源文件知道类型，是TypeScript的概念。自动完成，linting，......是必要的。 Angulars DI 使用构造函数参数的类型作为查找提供者的键。如果类型未通过导入规范化，Angulars DI 无法将其用作键。

提供是 Angulars DI 的一个概念，它定义了提供者的范围。 DI 在注入器的层次结构树中向上查找与键（类型）匹配的提供程序，然后 returns 从那里查找实例。

您可以使用字符串键或 OpaqueToken 而不是类型

bootstrap(AppComponent, provide('InitService', {useClass: InitService});

像

一样注入

constructor(@Inject('InitService') initService) {
  // no auto-completion or type checking because of missing type information
}

但是您会错过类型注释的一些优点。

Angular2中的组件还需要导入共享服务吗？

Does a shared service still need to be imported to components in Angular 2?

angular2-services

angular