CODEWITHSUNDEEP
angularionic-frameworkionic2
user8847246
user8847246

Reputation:

How to display each value of array per line - IONIC 2

Our code is home.html

<div *ngFor="let Server of Servers; let i = index; let f=first; let l=last;" >
 <p> {{Servers}}</p>
</div>

array created in home.ts as shown below

Servers=['1','2','3'];

I want the result on home.html page should be like:

1
2
3

Please advise.

Upvotes: 1

Views: 581

Answers (3)

Berk Akkerman
Berk Akkerman

Reputation: 483

The most logical solution:

<ion-list>
  <ion-item ion-item *ngFor="let Server of Servers; let i = index; let f=first; let l=last;"">
   <p> {{Server}}</p>
  </ion-item> 
</ion-list>

Tricky one(not recommended):

<div *ngFor="let Server of Servers; let i = index; let f=first; let l=last;" >
 <p> {{Server}}</p>
<br/>
</div>

Upvotes: 0

Sangwin Gawande
Sangwin Gawande

Reputation: 8166

You have included {{Servers}} instead of {{Server}} in <p> tag.

<div *ngFor="let Server of Servers; let i = index; let f=first; let l=last;" >
    <!-- Change to this -->
    <p>{{Server}}</p>
    <!-- Change to this -->
</div>

Simple example would be :

<div *ngFor="let item of Servers;" >
    <p>{{item}}</p>
</div>

Upvotes: 0

Sajeetharan
Sajeetharan

Reputation: 222572

It should be,

<div *ngFor="let Server of Servers; let i = index; let f=first; let l=last;" >
     <p> {{Server}}</p>
 </div>

Upvotes: 1

Related Questions