Angular2 DI 与 ES2016 装饰器？

Question

这是我最接近的 on github

我的服务是

@Injectable() export class TodoService {}

但我不确定如何使用 ES2016 装饰器将它注入到我的组件中。甚至有可能，还是装饰器是 Typescript 特定的？我知道在 TS 中有一个 emitDecoratorMetadata 选项。

Answer 1

使用providers or viewProviders到"provide"服务到组件：
将服务注入指定参数类型的组件构造函数：

@Component({
  // ...
  providers: [TodoService]
})
class TodoComponent() {

  constructor(todoService: TodoService) {
    this.todoService = todoService;
  }
}

或使用 Inject 参数装饰器。

@Component({
  // ...
  providers: [TodoService]
})
class TodoComponent() {

  constructor(@Inject(TodoService) todoService) {
    this.todoService = todoService;
  }
}

参数装饰器不是 ES2016 的一部分（您可以将其视为特定于 TypeScript 的）。但它们可以是 added to the standard later).

如果你真的想使用ES6/ES7，对parameters使用static getter:

@Component({
  // ...
  providers: [TodoService]
})
class TodoComponent() {

  static get parameters() {
    return [[TodoService]]; // you can also return just [TodoService]
  }

  constructor(todoService) {
    this.todoService = todoService;
  }
}

此外，我建议您阅读 this article 以更好地理解 angular2 依赖注入。

Angular2 DI 与 ES2016 装饰器？

Angular2 DI with ES2016 decorators?

ecmascript-2016

angular