通过查看依赖关系图，我们可以看到AppComponent组件使用了单独的LoggerService，DetailList组件也使用单独的LoggerService 实例，而Detail组件使用的是父组件DetailList的LoggerService实例。
目前来看没有达到我们的要求，我们的要求是每个组件都有单独的LoggerService实例，那么我们假设Detail组件的providers是我们忘记输入的，很难测试出原因所在。那么我们加入一个@Host()来限制注入器的查找范围。
对于注入器的向上查找方式，请参考官方文档。
为了便于调试，我们加入@Host().
@Host 装饰器将把往上搜索的行为截止在 宿主组件
detail.ts 提示detail组件加入@Host()装饰器
import {Component, Host}from '@angular/core'; import {LoggerService}from './logger.service'; @Component({ selector: 'detail', moduleId: module.id, templateUrl: './app-detail.component.html', providers: [ // { provide: LoggerService, useClass: LoggerService } ] }) export class AppDetailComponent { constructor( @Host() private logger: LoggerService) { } show(): void { this.logger.Debug(); } }
会提示找不到LoggerService的实例，@Host()的作用就是限制注入器查找到当前组件就停止，不会继续往上查找。所以会出现找不到Providers的错误。
加上providers 的结果就是我们想要的了。
完美的解决了多组件使用单独服务实例的问题。
总结：
1.如果要使组件单独使用服务，那么首先要在providers 中单独注册该服务。很容易理解
2.为了更好的检测可能出现的问题，在组件服务上加入@Host()装饰器，可以尽量早的抛出错误信息
3.使用ng2的debug工具
4.要明确各组件之间的关系，因为不同的组件关系会导致服务的实例的不同
5.服务尽量是模块级，不是应用级。