2017-02-07 3 views
1

В моем шаблоне, яКак связать элемент в цикле ngFor в Ionic 2?

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

Однако вместо отображения значения внутри цикла, я хочу, чтобы связать с ним где-то еще в шаблоне, вне цикла ngFor, как

<h1>{{ timespan }}</h1> 
<ion-card *ngFor="let item of items" [timespan]=“item.timespan”> 
    … 
</ion-card> 

Но я предполагаю, что не могу использовать [timespan], поскольку это не свойство ввода ионной карты.

Так кто-нибудь знает, как еще я могу реализовать это привязку?

Любая помощь очень ценится.

+1

Вы пробовали '* ngFor' с' template'? https://angular.io/docs/ts/latest/guide/template-syntax.html#!#star-template. Это также немного непонятно, что вы пытаетесь достичь. Несколько элементов, отображаемых в цикле? – silentsod

+0

Спасибо, Silentsod. Я попытался упростить код. На самом деле, карты обернуты в «swing-stack» из библиотеки Angular2-swing. Вместо того, чтобы показывать все элементы в стиле списка, он показывает каждую карточку поочередно, чтобы ее можно было оттолкнуть в соответствии с тиндером. Что касается использования шаблонов, это кажется хорошим решением ... – dbertels

ответ

1

Вы можете сделать это с помощью template вместо *ngFor обрабатывать петли:

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

Вот Plunker вы можете слоняться с.

+0

Большое спасибо silentsod, это работает. У меня есть дополнительные осложнения, так как все временные области отображаются одновременно, а не по одному. Но такое поведение следует ожидать, учитывая ситуацию, о которой я упоминал в комментариях. – dbertels

Смежные вопросы