Köşeli 2: Bileşeni dinamik olarak @ Giriş ve @ Çıkış

Question

ile yükle Bileşenlerimden bazılarını bu kod parçasıyla dinamik olarak yüklüyorum.

export class ComponentOutlet { 

    constructor(
     private vcRef: ViewContainerRef, 
     private compiler: Compiler, 
     private dataService: DataService 
    ) { } 

    private _createDynamicComponent() { 

     // Some logic to decide which component should be loaded 
     return MyComponent; 
    } 


    ngOnChanges() { 

     this.compiler.compileComponentAsync(this._createDynamicComponent()) 
      .then(factory => { 
       const injector = ReflectiveInjector.fromResolvedProviders([], this.vcRef.parentInjector); 
       this.vcRef.clear(); 
       this.vcRef.createComponent(factory, 0, injector); 
      }); 
    } 

sorun MyComponent bazı @Input ve Output bağlamaları olmasıdır. Bu bağlamaları burada ayarlamak mümkün mü? Bunu nasıl başarabilirim?

Answer 1

Girdi ve çıktılara yapılan bağlamalar, yalnızca başka bir bileşenin şablonuna statik olarak eklenmiş olan bileşenler için kullanılabilir. Senin durumunda

de (* imperatively RC6 ile

var cmpRef = this.vcRef.createComponent(factory, 0, injector); 
cmpRef.instance.someInput = value; 
cmpRef.instance.someOutput.subscribe(data => this.data = data);