如何在Angular中注入用于动态组件的提供程序?

时间:2018-07-14 14:13:02

标签: angular

我正在尝试为我的动态组件注入提供程序。但是我收到了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);
  }

1 个答案:

答案 0 :(得分:3)

我查看了您的StackBlitz,看来您需要将自定义 TypeError: /Users/max7z/projects/test/t24__test__koa-views_pug/views/index.pug:1 > 1| h1= uppercase(name) 2| uppercase is not a function 传递给ViewContainerRef#createComponent方法作为其第三个参数。

injector

此外,您还需要摆脱:

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

这可以解决您的问题。

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

enter image description here