각도 2 동적 양방향 바인딩

Question

다른 구성 요소를 동적으로 추가하는 구성 요소를 작성하려고합니다. 예를 들어 여기 내 부모 클래스이므로 :

import { Component, ComponentRef, ViewChild, ViewContainerRef, ComponentFactoryResolver } from '@angular/core'; 

@Component({ 
    templateUrl: './app/sample-component.component.html', 
    selector: 'sample-component' 
}) 
export class SampleComponent { 

    @ViewChild('dynamicContent', { read: ViewContainerRef }) 
    protected dynamicComponentTarget: ViewContainerRef; 
    private currentComponent: ComponentRef<any>; 
    private selectedValue: any; 

    constructor(private componentResolver: ComponentFactoryResolver) { 

    } 

    private appendComponent(componentType: any) { 
     var factory = this.componentResolver.resolveComponentFactory(componentType); 
     this.currentComponent = this.dynamicComponentTarget.createComponent(factory); 
    } 
} 

sample-component.component.html:

<div #dynamicContent></div> 

그것은 요소를 추가로 잘 작동하지만 난에서처럼, 동적으로 두 방법을 결합하는 방법에 대한 아무 생각이 없다 정적 구성 요소 : [(ngModel)]="selectedValue"

Answer 1

동적으로 추가 된 구성 요소를 사용한 바인딩은 지원되지 않습니다.

당신은 동적으로 추가 구성 요소 (https://angular.io/docs/ts/latest/cookbook/component-communication.html)
또는 당신이 읽을 수와 통신 할 수있는 공유 서비스를 사용할 수 있습니다/명령 적 this.currentComponent 참조를 사용하여 설정 :

private appendComponent(componentType: any) { 
    var factory = this.componentResolver.resolveComponentFactory(componentType); 
    this.currentComponent = this.dynamicComponentTarget.createComponent(factory); 
    this.currentComponent.instance.value = this.selectedValue; 
    this.currentComponent.instance.valueChange.subscribe(val => this.selectedValue = val); 
}