Referencing object values as parameters for a method called in page.html


#1

Hi everyone.

I’ve been searching a while and haven’t been able to find a way to achieve this. If someone could point me in the right direction it would be much appreciated. Here is part of my code:

<ion-item *ngFor=“let item of items” class=“result”>

No image available

{{item.Name}} • {{calculateDistance()}} km away

I want to pass parameters to the calculateDistance() method like this:

{{calculateDistance({{item.someValue}})}}

Is this possible in any way?

Thank you


#2

Hey!
Assuming you have some class like this:

export class MyPage {
   public items: Array<any> = [{someValue: 1},{someValue: 2},{someValue: 3},{someValue: 4}]
   constructor() {}

   public calculateDistance(someValue) {
      return someValue + 1;
   }
}

you can use it like this in you template

<ion-list> 
   <ion-item *ngFor="let item of items">
      {{calculateDistance(item.someValue)}}
   </ion-item>
</ion-list>

#3

Thank you so much that did the trick! Just needed to remove the {{}} the achieve the correct syntax.

Thanks again!