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

Question

I'm trying to inject providers for my dynamic components. But I'm getting StaticInjectionError. But not sure, how to fix this issue. I have provided the Stackblitz example below.

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);
  }

Answer 1

I looked at your StackBlitz, and looks like you need to pass your custom injector to ViewContainerRef#createComponent method as its 3rd parameter.

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

Also, you need to get rid of:

componentFactory.create(injector);

That solves your issue.

Here is screen grab of working code.