how to get array index in angular 5 html?

Question

i have one array and i want display array index and it's value also in angular 5 html, here is my array,

Anil K Chaudhary
0: {is_present: "1", name: "Anil K Chaudhary", date: "22"}
1: {is_present: "0", name: "Anil K Chaudhary", date: "20"}

Laxman J chavda
0: {is_present: "0", name: "Laxman J chavda", date: "22"}
1: {is_present: "1", name: "Laxman J chavda", date: "20"}

below is my html code,

<tr *ngFor = "let getAttendanceData_new of getAttendanceData[key]">
  <td>{{getAttendanceData_new}}</td>   // i want to display array Index here. (e.g "Anil K Chaudhary", "Laxman J Chavda")

  <!-- ======== AND ALSO WANT HERE THEIR VALUE ======== -->
  <td *ngFor="let getDays_new of getDays;let i = index">
    <b *ngIf="getAttendanceData.is_present == 1 && getDays_new == getAttendanceData.date" style="color:green">P</b>
    <b *ngIf="getAttendanceData.is_present == 0 && getDays_new == getAttendanceData.date" style="color:lightgrey">A</b>
  </td>

</tr>

Please elaborate more so that others can understand and provide the solution that you are expecting. — Pramod Patil
– Pramod Patil, Commented Jan 23, 2018 at 7:17

Vivek Doshi · Accepted Answer · 2018-01-23 07:46:37Z

3

Till now the best / shortesr answer I found is

Component side :

objectKeys = Object.keys;

Template side :

<div *ngFor='let key of objectKeys(jsonObj)'>
   Key: {{key}}

    <div *ngFor='let obj of jsonObj[key]'>
        {{ obj.title }}
        {{ obj.desc }}
    </div>

</div>

WORKING DEMO

answered Jan 23, 2018 at 7:46

Vivek Doshi

58.8k12 gold badges120 silver badges126 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Vivek Doshi Over a year ago

@Chaudhary, Glad to know , Happy Coding :)

Emre Kabaoglu · Accepted Answer · 2018-01-23 07:28:11Z

0

You could use filter of Angular

{{ getAttendanceData_new | filter : {'name':index} }}

edited Jan 23, 2018 at 7:28

answered Jan 23, 2018 at 7:15

Emre Kabaoglu

13.2k4 gold badges27 silver badges48 bronze badges

2 Comments

Apurv Chaudhary Over a year ago

but i did not get name bcoz my array Index is not an integer it's NAME, so how can i get Name?

Apurv Chaudhary Over a year ago

it give Error "The pipe 'filter' could not be found"

Collectives™ on Stack Overflow

how to get array index in angular 5 html?

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related