Question

仅供参考：使用angular2（2.0.0-alpha.45）＆amp; TypeScript（1.6.2）

尝试创建一个简单的服务以注入组件。

我得到的错误：

无法解析{ComponentName}（？）的所有参数。确保它们都有有效的类型或注释。

自举：

bootstrap(App, [ROUTER_PROVIDERS, HTTP_PROVIDERS]);

服务（my-service.ts）：

import {Injectable} from 'angular2/angular2';
@Injectable()
export class MyService {
  public doSomething() {}
}

消费组件：

import {Component} from 'angular2/angular2';
import {MyService} from './my-service';
export class ListManager{
  constructor(private myService: MyService){
    console.log('myService', myService);
  }
}

我尝试过的事情

在服务中：
- 使用@Injectable
在引导中：
- 将MyService添加/删除到提供商的引导列表
在组件中
- 将服务指定为提供者@Component({providers: [MyService]})
- 将服务指定为绑定@Component({bindings: [MyService]})

Answer 1

我想你会这样做：

constructor(private myService: MyService){
    console.log('myService', myService);
}

您还必须在@Component定义

中将服务指定为提供者

@Component({
  ...
  providers: [MyService]})

Answer 2

尝试在您的组件中执行此操作：

import {Component} from 'angular2/angular2';
import {Inject} from 'angular2/core';
import {MyService} from './my-service';

export class ListManager{
  private listService: ListService;

  constructor(@Inject(ListService) listService: ListService){
      console.log('listService', listService);
  }
}

（注意构造函数中的新导入和@Inject）

让我知道它是否适合你。一个plunker也将帮助隔离问题。

将服务注入组件

2 个答案: