Ionic 2 data binding with function?


#1

For a list of items, depending on the value of a certain key in the item, I’d like to show different images. Is this possible in Ionic 2 through some kind of interpolation/data binding using a function?

For example:

items = [
    {thing: "abc", state: "1"},
    {thing: "xyz", state: "2"},
    .....];

and display the item list as

<ion-list>
    <ion-item *ngFor="#item of items">
        {{item.title}}
        <img src=getImage({{item.state}})>    <---- Is this possible?
    </ion-item>
</ion-list>

where getImage(state) function would return the path to the image file depending on the value of state.


#2

Yes, it’s possible, but this is the correct way to do it:

<img src="{{getImage(item.state)}}" />