Как решить значение динамически добавленного компонента в Angular 2?

Question

У меня модальный компонент состоит из информации об устройстве, в которой я динамически добавляю пользователя <user.component.ts>, приведенный ниже. Он добавляется & оказано успешно, но каким-то образом я не могу получить информацию о выбранном пользователе в модальном <modal.component.ts>.

modal.component.ts

@Component({ 
    selector: 'modal', 
    templateUrl: './modal.component.html' 
}) 
export class ModalComponent { 
    constructor(injector: Injector, 
      componentFactoryResolver: ComponentFactoryResolver) {} 

    @ViewChild('userContainer', { read: ViewContainerRef }) userContainer: ViewContainerRef; 
    cmp: ComponentRef<UserListComponent>; 

    addComponent() { 
     const factory = this.componentFactoryResolver.resolveComponentFactory(UserListComponent); 
     this.cmp = this.userContainer.createComponent(factory); 
    } 
} 

user.component.ts

@Component({ 
    selector: 'user', 
    templateUrl: `<select [(ngModel)]="user"> 
      <option *ngFor="let user of users" [ngValue]="user">{{user.name}}</option> 
     </select>` 
}) 
export class UserComponent {...} 

Answer 1

EventEmitter использовать или Observable, который излучает значения по изменению

@Component({ 
    selector: 'user', 
    templateUrl: `<select [(ngModel)]="user"> 
      <option *ngFor="let user of users" [ngValue]="user">{{user.name}}</option> 
     </select>` 
}) 
export class UserComponent { 
    @Output() userChange:EventEmitter = new EventEmitter(); 

    private _user:any; 
    get user() { 
     return this._user; 
    } 

    set user(val) { 
     this._user = val; 
     this.userChange.emit(val); 
    } 
} 

и подпишитесь на изменения:

addComponent() { 
    const factory = this.componentFactoryResolver.resolveComponentFactory(UserListComponent); 
    this.cmp = this.userContainer.createComponent(factory); 
    this.cmp.instance.userChange.subscribe(val => console.log(val)); 
}