Kari
Kari

Reputation: 269

ng-repeat is not iterating over array (Ionic4/Angular7)

So, this is my first project with Ionic and Angular. I believe I am doing something really simple but it won't work.

In my mips.page.ts I am declaring:

mips = ["bla", "blub", "blubba"];

In the mips.page.html I can do:

<span>{{ mips[0] }}</span>

and get the proper output "bla". But when I try:

<ion-item ng-repeat="mip in mips">
  {{ mip }}
</ion-item> 

only one item is being created and it is empty. Where am I going wrong?

Upvotes: 0

Views: 491

Answers (2)

Bhagwat Tupe
Bhagwat Tupe

Reputation: 1943

Angular 7 has *ngFor keyword to loop through collection of Array as well as objects.
so please change ng-repeat by *ngFor like this
<ion-item *ngFor="let mip of mips"> {{ mip }} </ion-item>

Upvotes: 2

Pranav C Balan
Pranav C Balan

Reputation: 115262

In Angular, you have to use ngForOf structural directive(*ngFor) for iterating since ng-repeat is Angularjs syntax which won't work with Angular.

<ion-item *ngFor="let mip of mips">
  {{ mip }}
</ion-item> 

Upvotes: 5

Related Questions