How to dynamically add function input in html?

#1

Hi guys,

I am making an ionic3 app and I am trying to add a function “nextPage(someData)” to my html.

In my html (pardon the html, seems like I cant show it properly here):

div *ngFor=“let item of items”
<ion-card (click)=“nextPage(someData)”>

In my ts:

nextPage(inputData: string): void{
this.data = inputData;
this.navCtrl.push(“nextPage”,{data:this.data});
}

As you can see I am adding nextPage(someData) function to my ion-card component and the someData will come from the items array that I have. Hence each ion-card component will have different data for its nextPage(someData). What I am trying to do is basically dynamically add ion-cards with each clicking will send different data to next page.

However how can I pass someData to nextPage()? I tried nextPage({{ item[0] }}) but it goes me a template error.

Thanks guys!

#2

Hello,
if somedata is a member of item, then

(click)=“nextPage(item.someData)”

Best regrads, anna-liebt

#3

Great!

I was using array hence it was actually item[0]. But thanks!

#4

In ur function simply put nextPage(somedata){console.log(somedata); this.navCtrl.push(page, {data: somedata)}
U can use that data

#5

I f u want to use some input data to pass look for two way binding