Call a function automatically when my html is loaded

#1

Hi everyone,

I’m trying to run a function when my list is loaded. To do this, I’m using ngFor to get my data from my array but for one field I need to call a function with a property from this array.
Do you know how can I do it?

This is my code:

<ion-row *ngFor="let rank of rank">
            <ion-col col-4 onload="getName({id: rank.id})">
              // Want my team name here
            </ion-col>
            <ion-col col-2>
              {{rank.played}}
            </ion-col>
            <ion-col col-2>
              {{rank.goal_in}} : {{rank.goal_out}}
            </ion-col>
            <ion-col col-2>
              {{rank.difference}}
            </ion-col>
            <ion-col col-2>
                {{rank.points}}
            </ion-col>
      </ion-row>

but here my function getName is not called
thanks for your time

#2

Perhaps you can call your function in hier.ts File in ionViewDidLoad

This function start if the view loads

#3

You can try with the following code:

<ion-row *ngFor="let rank of rank">
            <ion-col col-4>
              {{getName({id: rank.id})}}
            </ion-col>
            <ion-col col-2>
              {{rank.played}}
            </ion-col>
            <ion-col col-2>
              {{rank.goal_in}} : {{rank.goal_out}}
            </ion-col>
            <ion-col col-2>
              {{rank.difference}}
            </ion-col>
            <ion-col col-2>
                {{rank.points}}
            </ion-col>
      </ion-row>

Try it and tell to us if it worked :smile:

#4

Never call functions, especially ones with side effects, from within interpolation expressions. They get called a zillion times.