2017-08-04 10 views
1

入力をコンポーネントトラフに渡そうとすると問題が発生します。 私はconsole.logのhome.ts上の配列と私はオブジェクトです、そして、私はcomponent.ts上のコンポーネントに渡すとき、それは文字列を取得します。私はコンポーネントTSでもイオン2:コンポーネントに配列を渡すとcomponent.tsに文字列が得られる

をそれを行う場合、私は知らない

私はこの持っている:

@Component({ 
    selector: 'micomponente', 
    templateUrl: 'micomponente.html' 
}) 
export class MicomponenteComponent { 
    @Input() pra:any=[]; 
    text: string; 

    constructor() { 
    console.log('Hello MicomponenteComponent Component'); 
    this.text = ''; 
    } 

    ngOnInit() { 
    console.log(typeof(this.pra)) //this is the red arrow on the picture 
    this.text = this.pra; 
    } 

} 

home.html

<ion-content padding> 
<micomponente pra="{{algo}}"></micomponente> 
</ion-content> 

home.ts

export class HomePage { 
algo:any=[]; 

    constructor(public navCtrl: NavController) { 
    this.algo.push(['1','fsa']); 
    this.algo.push(['2','fsd']); 
    console.log(this.algo) 

    } 

} 

これはコンソールログです

console log image

答えて

0

プロパティは[]括弧に入れられるべきで、プロパティが引用符である必要があり、子コンポーネントにデータを渡します。 あなたの例では、入力データは次のように渡される必要があります。

<ion-content padding> 
    <micomponente [pra]="algo"></micomponente> 
</ion-content> 

は、子コンポーネントへとからデータを渡す方法についてはhttps://angular.io/guide/component-interactionを参照してください。 プロパティをhtmlで文字列として表示するために、補間には二重中括弧が使用されます。補間の詳細については、ここをクリックしてください:https://angular.io/guide/template-syntax#interpolation----

関連する問題