2016-08-19 9 views
2

私はGünterZöchbauerのアドバイスhow to create dynamic components に従っていました。子コンポーネントに@入力があるように値を渡す方法がわかりました。Angular2 - ComponentFactoryで作成された動的コンポーネントに値を渡す

上記の質問の例(plunker)を使用すると、子コンポーネントに文字列を渡す方法、「追加」ボタンをクリックすると表示されるメッセージを呼び出す方法があります。ここで

は、子コンポーネントがどのように見えるかの例です:

import {Component OnChanges, Input} from '@angular/core' 

    @Component({ 
     selector: 'hello', 
     providers: [], 
     template: `<h1>{{message}}</h1>`, 
     directives: [] 
    }) 
    export class HelloComponent implements OnChanges { 
     @Input() message:any; 

     constructor() { 
     } 

     ngOnChanges(changes:any){ 
     } 
    } 

答えて

9

あなたは以下試すことができ、ここで

let instance = this.viewContainerRef.createComponent(this.componentFactory, 0).instance; 
    instance.message = "some text!!"; 

Plunker!!

は、この情報がお役に立てば幸いです!

+1

ダミーデータを最初に渡して読み込み画面を表示してから、APIからデータを取得したら、渡したいと思います。それは可能ですか? – indra257

関連する問題