我即将使用multi-provider导出我的依赖项的依赖项及其自身,因此可以立即将它们注入到组件中。
对于组件
import {Component} from 'angular2/core';
import { FOO_PROVIDERS } from './foo';
@Component({
selector: 'app',
providers: [FOO_PROVIDERS]
})
export class App {}
import {Inject, Injectable, provide} from 'angular2/core';
import {Http, HTTP_PROVIDERS} from 'angular2/http';
export class Foo {
constructor(@Inject(Http) http) {}
}
export const FOO_PROVIDERS = [
provide(Foo, { useClass: Foo, multi: true }),
provide(Foo, { useValue: HTTP_PROVIDERS, multi: true })
];
将导致
没有Http的提供商! (App - > Foo - > Http)
import {Inject, provide} from 'angular2/core';
import {Http, HTTP_PROVIDERS} from 'angular2/http';
class Foo {
constructor(@Inject(Http) http) {}
}
export const FOO_PROVIDERS = [Foo, HTTP_PROVIDERS];
工作正常,而我希望他们能做同样的工作。
在这种情况下,是否正确使用多提供商?
答案 0 :(得分:3)
当您注册provide(Foo, ...),
时,
constructor(foo:Foo)
multi: true
您将通过注册为Foo
constructor(foo:any)
用
export const FOO_PROVIDERS = [
provide(Foo, { useClass: Foo, multi: true }),
provide(Foo, { useValue: HTTP_PROVIDERS, multi: true })
];
和
constructor(@Inject(Foo) foo:Foo[])
你会被传递给foo
一个包含Foo
实例的数组,第二项是一个提供者列表(这些包含在HTTP_PROVIDERS
中)
<强>更新强>
也许你对应该发生什么有不同的期望。我不知道@Inject(Http) http
在这里是如何相关的。 HTTP_PROVIDERS
仅作为Foo
的值注册。在解析提供者时,传递给useValue
的值无关紧要。 DI查找Foo
的提供者并传递指定的值,并不关心该值是什么。您的示例中没有Http
的提供者,因此Foo
本身无法注入Http
。您需要注册Http
,这是在将HTTP_PROVIDERS
直接添加到提供商(而不是useValue
)时完成的,因为HTTP_PROVIDERS
包含Http
(相当于到provide(Http, {useClass: Http})
<强> UPDATE2 强>
// An injected service that itself needs to get passed in a dependency
@Injectable()
class Foo {
constructor(private http:Http);
}
// container for a bunch of dependencies
@Injectable()
class MyProviders {
// add everything you want to make available in your components
constructor(public foo:Foo, public bar:Bar, ...);
}
class MyComponent {
// inject just MyProviders and use the dependencies it provides
constructor(private providers: MyProviders) {
// access provided values
providers.foo.doSomething();
providers.bar.doSomethingElse();
}
}
// Add all providers to allow DI to resolve all above dependencies
bootstrap(AppComponent, [HTTP_PROVIDERS, Foo, Bar]);
}