Question

我尝试将一个服务（TodoStore）注入我的组件（TodoList），但是没有使用装饰器。它的唯一工作方式是使用构造函数参数装饰器

constructor(@Inject(TodoStore) store)

我认为这不是有效的ES7。我试图在类之前或构造函数之前放入注入，既不能用于Webpack。我目前最符合标准的解决方案是

static get parameters() {
  return [[TodoStore]];
}

我的问题是，有效的ES6 / ES7装饰器是否有一种注入依赖关系的方法？

Answer 1

实际上，您不需要使用@Inject注释。您的服务需要@Injectable注释。

import {Injectable} from 'angular2/core';

@Injectable()
export class TodoStore {
  (...)
}

为了能够将它注入到组件中，只需将其添加到其构造函数的参数中并添加到其提供者列表中：

import {TodoStore} from './todoStore';

@Component({
  selector: 'todo-list',
  providers: [ TodoStore ],
  template: `
    (...)
  `
})
export class TodoListComponent {
  constructor(service:TodoStore) {
    this.service = service;
  }
  (...)
}

希望它可以帮到你，亨利

Answer 2

试试这个：

import {Component, Inject} from 'angular2/core';
import {TodoStore} from './todoStore';

@Component(...)
export class TodoListComponent {
  constructor(service) {
    this.service = service;
  }
  ...
}

// Workaround for parameter annotations
TodoListComponent.parameters = [new Inject(TodoStore)];

如何使用javascript装饰器进行Angular2依赖注入？

2 个答案: