Ionic2 - 从离子列表中获取单击的项目并绑定到输入字段



>我有一个数组public items = ['item1', 'item2', 'item3'];我在视图中将其用作:

<ion-slide> <ion-list inset>
<ion-item *ngFor="let item of items" (click)="getItem(title)">
{{ title }}
</ion-item>
</ion-list> </ion-slide>

我的getItem(title(函数是:

getItem(item) {
console.log(item);
this.slider.slideNext();
}

所以基本上我滑动到下一个幻灯片项目,并将该项目作为参数传递。 在我的第二张幻灯片上,我使用:

<ion-slide> <ion-item>
<ion-label stacked>Label</ion-label>
<ion-input type="text">{{ item }}</ion-input>
</ion-item> </ion-slide>

我想将第一张幻灯片中单击的项目显示为第二张幻灯片中输入字段的值。

在组件中,只需声明一个变量来存储所选项目,并在幻灯片中显示该变量

export class MyComponent {
public selectedItem: any;
constructor(){}
getItem(item) {
// store item in variable
this.selectedItem = item;
console.log(item);
this.slider.slideNext();
}

}

然后在您的 HTML 中

<ion-slide> 
<ion-item>
<ion-label stacked>Label</ion-label>
<ion-input type="text" [(ngModel)]="selectedItem"></ion-input>
</ion-item> 
</ion-slide>

最新更新