angular - 如何使用 Angular2 将服务注入(inject)动态组件

Question

我有一个组件可以使用 DynamicComponentLoader 动态加载另一个组件。但是，动态组件需要注入(inject)服务。但是，我不确定如何去做。我从 Angular.io 文档中看到 DynamicComponentLoader 接受一个 ResolvedProvider 数组。

我尝试通过以下方式获得提供者:

var provider = provide(ManagerService, {useExisting: ManagerService});
dcl.loadIntoLocation(this.data.template, this.er, "content",[provider]);

这似乎行不通。你可以看到一个 example on plunker .

在 plunker 示例中，您可以看到 Info 组件已加载(因为它不需要服务)但 Alternate 组件不会加载。

我有点困惑，因为服务是在根组件中注入(inject)的，所以我认为它会在每个子组件被调用时自动注入(inject)。

如何注入(inject)此服务？

Answer 1

它应该和普通的 DI 没有什么不同

this.dynamicComponentLoader.loadIntoLocation(MyComponent, this.elementRef, "content")


class MyComponent{
  constructor(someService:SomeService){}//injected here when instantiated
}

如果您的动态加载组件在构造函数中注入(inject)服务，它会像普通 DI 一样工作。

尽管如此，请确保该服务已在某个提供程序数组中注册。在组件级别或链中的更高级别(父级或 Bootstrap )