Question

这是我的主要组件（根组件）。在这里，我声明了一些应该可以通过整个应用程序访问的服务。

@Component({
    ...
    providers: [
      WebSocketService,
      ...
      AuthenticationService,
    ]
})
export class MainComponent { ... }

并且 - 确保evrybody理解 - 我正在做：

bootstrap(MainComponent, [...]);

WebSocketService和AuthenticationService都使用@Injectable()进行注释。一切正常，直到我发现两个服务都需要彼此。 AuthenticationService需要WebSocketService与后端服务器通信，WebSocketService需要AuthenticationService来检查用户是否已被登录等。

因此，我收到了错误消息：

EXCEPTION：无法解析所有参数＆＃39;的AuthenticationService＆＃39;（未定义）。确保所有参数用Inject修饰或具有有效的类型注释＆＃39;的AuthenticationService＆＃39;用Injectable装饰。

这是AuthenticationService的片段。 WebSocketService看起来很相似。

@Injectable()
export class AuthenticationService implements OnInit {

    constructor(private webSocketService:WebSocketService) {
    }
    ...
}

我知道，对于这种情况（第三种服务等）有不同的，可能更好的解决方案，但这不是我的问题。我想知道是否有办法用Angular2以类似的方式将两个服务注入彼此？

Answer 1

<强>更新（未经测试）

bootstrap(AppComponent, [
  provide(WebSocketService, {useFactory: () => {
    let as = new AuthenticationService();
    let ws = new WebSocketService(as);
    as.webSocketService = ws;
    return ws;
  }}),
  provide(AuthenticationService, {useFactory: {(ws) => {
    return ws.authenticationService;
    }, deps: [WebSocketService]);
  })
]);

<强>原始（仅适用于类型依赖项，而不适用于依赖项）

需要使用forwardRef解析引用的循环（需要从angular2/core导入

constructor(@Inject(forwardRef(() => WebSocketService)) private webSocketService:WebSocketService) {

Angular2 - 当两个服务都需要彼此时

1 个答案: