[英]Angular2 dependency injection, service not being injected during class inheritance
[英]Angular 2 dependency injection - A service is injected in some components but not in all
我正在开发一个Angular 2应用程序,该应用程序只有一个模块,其中有几个服务在bootstrap中注册为提供者。 该应用程序还在同一模块中使用这些服务的几个组件。
所有组件都使用DI接收服务(服务在construtor中声明为参数)。
我面临的问题是:在某些组件中正确注入了相同的服务,但在其他组件中没有。
我检查了Injector对象中注入失败的组件以及服务实例是否在Injector对象中。 失败的是使用Injector.get()方法进行搜索。 作为参数提供的令牌与存储在Injector字典中的令牌不同。 我无法找到原因,因为我使用的是服务的类名,而Javascript引擎会自动从此类名生成令牌。
我尝试使用OpaqueTokens来控制注入,并且,即使我使用相同的不透明令牌,当调用Injector.get()方法时,参数提供的令牌被认为与注入器存储的令牌不同。
代码中的一个简短片段看起来像
myservice.service.ts
import { OpaqueToken } from '@angular/core'
export const BACKEND = new OpaqueToken('backend');
app.module.ts
import { BACKEND } from 'myservice.service'
...
providers: [{ provide: BACKEND, useValue: "TestValue" }]
mycomponent.component.ts
import { Component, Inject } from '@angular/core'
import { BACKEND } from 'myservice.service'
@Component(
{
selector:'mycomponent'
templateUrl: ...
})
export class MyComponent
{
constructor(@Inject(BACKEND) config: string) {
console.info(JSON.stringify(config));
}
}
这种带有BACKEND令牌的注入适用于某些组件,但对于其他组件则不适用(注入空{}对象)。 我试图在浏览器中调试Javascript代码,它看起来像是使用与字典中的令牌不同的令牌调用Injector(它们看起来相同,具有相同的名称'后端'但仍然不同而且===返回false) 。
注意:我使用的是Angular 2.4.2,Typescript 2.1,带有'commonjs'模块和'node'模块解析。 systemjs用作模块加载器。
请你能提供一些关于如何解决这个问题的想法吗?
谢谢,
您是否有来自不同模块/组件的各种提供者声明? 对于providers数组中的每个声明,angular将创建这些服务的新实例。
你是否在@Injectable装饰器中包含了括号? https://angular.io/docs/ts/latest/guide/dependency-injection.html#!#injectable
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.