如何使用Angular2將服務注入動態組件

Question

我有一個使用DynamicComponentLoader動態加載另一個組件的組件。 但是，動態組件需要注入服務。 但是，我不確定如何解決這個問題。 我從Angular.io文檔中看到DynamicComponentLoader接受ResolvedProvider數組。

我試圖通過以下方式獲得提供商：

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

這似乎不起作用。 你可以在plunker上看到一個例子 。

在plunker示例中，您可以看到Info組件加載（因為它不需要服務），但Alternate組件將不會加載。

我有點困惑，因為服務是在根組件注入的，所以我認為它會在被調用時自動注入每個子組件。

如何注入此服務？

Answer 1

它不應該與正常的DI有任何不同

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


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

如果動態加載的組件在構造函數中注入服務，它就像普通的DI一樣工作。

確保服務已在某些提供程序數組中注冊。 在鏈中的組件級別或更高級別（父級或引導程序）