2017-02-07 6 views
1

、私はイオン2のngForループの項目にバインドする方法は?私のテンプレートで

<ion-card *ngFor="let item of items"> 
    <p>{{ item.timespan }}</p> 
</ion-card> 

しかし、代わりに、ループ内で値を表示するので、私は

<h1>{{ timespan }}</h1> 
<ion-card *ngFor="let item of items" [timespan]=“item.timespan”> 
    … 
</ion-card> 
のように、ngForループの外で、どこかのテンプレート内からそれにバインドするしています

しかし、私はイオンカードの入力プロパティではないので、[timespan]を使うことはできないと仮定します。

だから誰も私がこのバインディングを実装する方法を知っていますか?

大変助かりました。

+1

'* ngFor'を' template'で試しましたか? https://angular.io/docs/ts/latest/guide/template-syntax.html#!#star-templateあなたが達成しようとしていることはちょっとわかりません。ループ内でレンダリングされる複数の要素? – silentsod

+0

ありがとうsilentsod。私はコードを単純化しようとしました。実際には、カードはAngular2-swingライブラリから 'swing-stack'にラップされています。すべてのアイテムをリスト形式で表示するのではなく、各カードを順番に表示して、紐のような形でスワイプします。テンプレートを使用することに関して、それは良い解決策であるようです... – dbertels

答えて

1

あなたはループを処理するためにtemplate代わりの*ngForを使用することによって、これを達成することができます

<template ngFor let-item [ngForOf]="items"> 
    <h1>{{item.timespan}}</h1> 
    <ion-card> 
    … 
    </ion-card> 
</template> 

をここでは、約マックできるPlunkerです。

+0

ありがとうso silentsod、これは動作します。私はすべてのタイムパンが一度に1つではなく一度に表示されるので、合併症を追加しました。しかし、その行動は私がコメントで言及した状況を考えれば予想される。 – dbertels

関連する問題