Angular2 , get specific element from Array of Arrays using NgFor

Question

My goal is to get the array of objects of any index from the services array of arrays, and cycle through that array of objects through *ngFor

FILE.TS

services:  Array<Servizio[]> = [];

FILE.HTML this is what I'd like to be able to do , but nothing shows in my list

  <li *ngFor="let servizio of services[0]"> 
                                <a href="#">{{servizio.name}}</a>
                            </li>

Sajeetharan · Accepted Answer · 2017-10-20 09:53:15Z

1

ngFor works on an array, you are trying to use over first element of the array which is an object, you should do

 <li *ngFor="let servizio of services"> 
      <a href="#">{{servizio.name}}</a>
 </li>

answered Oct 20, 2017 at 9:53

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

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

Comments

Staticshot · Accepted Answer · 2017-10-20 14:19:28Z

1

I post the solution to my problem in case it's helpful to anyone :

<ul class="nav nav-list">
                                <span *ngFor="let servizio of services; let idx = index">
                                    <span *ngIf="idx  === 2">
                                        <li *ngFor="let ser of servizio">
                                            <a href="#">{{ser.name}}</a>

                                        </li>
                                    </span>
                                </span>
                            </ul>

answered Oct 20, 2017 at 14:19

Staticshot

415 bronze badges

Comments

Chandru · Accepted Answer · 2017-10-20 10:30:18Z

0

Try like this :

my example :

template

<ul>
    <li *ngFor="let servizio of services[0]?.subMenuItem"> 
        <a href="#">{{servizio.name}}</a>
    </li>
</ul>

typescript :

services: Array<any[]> = [{
    "name": "xyz",
    "subMenuItem": [{
        "name": "abc"
    }, {
        "name": "cde"
    }],
    "icon": "home"
}, {
    "name": "pqr",
    "subMenuItem": [{
        "name": "abc"
    }, {
        "name": "cde"
    }],
    "icon": "home"
}];

answered Oct 20, 2017 at 10:30

Chandru

11.2k6 gold badges43 silver badges54 bronze badges

2 Comments

Staticshot Over a year ago

Thank you for your answer , what I'm trying to do is to access through *ngFor the first array of objects of the type Servizio from the services array and cycle through the elements of that array , any idea on how to ?

Chandru Over a year ago

can you provide example data for services ?

Collectives™ on Stack Overflow

Angular2 , get specific element from Array of Arrays using NgFor

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related