如何在 Angular 中为动态组件注入提供者？

【问题标题】：How to inject providers for dynamic components in Angular?如何在 Angular 中为动态组件注入提供者？
【发布时间】：2018-07-14 14:13:01
【问题描述】：

我正在尝试为我的动态组件注入提供程序。但我得到了 StaticInjectionError。但不确定，如何解决这个问题。我在下面提供了 Stackblitz 示例。

https://stackblitz.com/edit/angular-cr1vkv

createComponent() {

    // THIS IS NOT WORKING
    let injector = Injector.create([{
      provide: 'TEST', useValue: 'Manoj'
    }]);

    let componentFactory = this.componentFactoryResolver.resolveComponentFactory(HelloComponent);

    componentFactory.create(injector);

    let viewContainerRef = this.adHost.viewContainerRef;
    viewContainerRef.clear();

    let componentRef = viewContainerRef.createComponent(componentFactory);
  }

【问题讨论】：

标签： angular

【解决方案1】：

我查看了您的 StackBlitz，看起来您需要将自定义 injector 传递给 ViewContainerRef#createComponent 方法作为其第三个参数。

let componentRef = viewContainerRef.createComponent(componentFactory, 0, injector);

另外，你需要摆脱：

componentFactory.create(injector);

这解决了你的问题。

这是工作代码的屏幕截图。

【讨论】：