Question

我们可以动态加载组件时注入不同的提供程序吗？

我组分

  @Component({
     moduleId: module.id,
     selector: "my-component",
     template: "<div>my-component</div>",
     providers: [MyComponentService]
  })
  export class MyComponent{

     constructor(private ds: MyComponentService) {
        super();
     }    
   }

其他地方，

     this._cr.resolveComponent(MyComponent).then(cmpFactory => {
        let instance: any = this.testComponentContainer.createComponent(cmpFactory).instance;
    });

所以在上面的代码中，在解析MyComponent时，此MyComponentService的提供者也将得到解决，我们可以根据某些切换以不同的方式解决它吗？

Answer 1

ViewContainerRef.createComponent

createComponent(componentFactory: ComponentFactory<C>, index?: number, injector?: Injector, projectableNodes?: any[][]) : ComponentRef<C>

有一个injector参数。如果你传递一个这个用于解析提供者。我不认为你可以覆盖添加到@Component()装饰器的提供者。

您可以创建新的进样器Injector

let injector = ReflectiveInjector.resolveAndCreate([Car, Engine])

并传递此进样器，或者您可以将进样器注入调用ViewContainerRef.createComponent的组件并创建子进样器。

constructor(private injector:Injector) {}

Injector是通用基类ReflectiveInjector是具体实现。

let resolvedProviders = ReflectiveInjector.resolve([Car, Engine]);
let child = ReflectiveInjector.fromResolvedProviders(resolvedProviders, this.injector);

这样就可以传递当前组件可用的提供程序，并添加Car和Child。因此，child无法解析（Car和Engine以外的提供商）的提供商会尝试从父注入中解析。

Plunker example

在Angular 2中使用ComponentResolver加载组件时注入不同的提供程序

1 个答案: