CODEWITHSUNDEEP
angularngfor
Lea
Lea

Reputation: 1285

Angular2 Can I get a count number of ngFor?

Hi I'm looping json string using ngFor but is it possible to show the number of looping items instead of showing its value?

for example in my component I have

items = {item1, item2, item3, item4}

and in html template

<p *ngFor="let i of items>{{i}}</p>

then the result will be

item1
item2
item3
item4

but instead of that, since there are four items in the object, I want to display the number 4 (a number of items in the object).

 4

How can I achieve this?

Thanks!

Upvotes: 4

Views: 14110

Answers (2)

Mohit Jain
Mohit Jain

Reputation: 351

You don't need to loop your Json String, Just use length property.

TS code:

 items: string[] = ['item1', 'item2', 'item3'];

Inside Html use it:

{{items.length}}

Upvotes: 2

Lucas
Lucas

Reputation: 10313

This will display the number on each iteration:

<p *ngFor="let i of items>{{ items?.length }}</p>

Upvotes: 4

Related Questions