Display elements of array inside objects

[travis haycock]

I'm trying to to figure out how to display the elements of my array inside my object. In my case I have a list of exercises being displayed and inside the object there is an array that are the repetitions and each element corresponding to set number. Below you will see the data i'm working with how i'm currently trying to access them should be noted, I am able to display the exercises I just cant get the particular array to be associated with the object that it's suppose to be currently when I expand the mat element there are just 5 arrays inside with the elements belonging. 

 this.usersSession = [{ "exercise": "chest press", sets: [12, 45, 32, 14] },
 { "exercise": "cable crossover", sets: [12, 5, 6, 31, 1] },
 { "exercise": "incline chest press", sets: [12, 45, 32, 14] },
 { "exercise": "decline chest press", sets: [12, 88, 2, 1] },
 { "exercise": "push up ", sets: [12, 45, 32, 14] }
 ]

 this.exercise = this.usersSession.map(function (exercise_names) {
 return exercise_names.exercise
 });
 console.log(this.exercise)

 
 this.set = this.usersSession.map(function (sets_reps) {
 return sets_reps.sets
 });
=================================================================================================================================================================
HTML BELOW

     <mat-accordion>
              <mat-expansion-panel *ngFor="let panel of usersSession">
                <mat-expansion-panel-header>
                  {{panel.exercise}}
                </mat-expansion-panel-header>
              <ul>
                    <li *ngFor="let repsCount of set">{{set}}</li>
                  </ul>
              </mat-expansion-panel>
            </mat-accordion>

[Christophe HOARAU]

You are using "set" which is defined nowhere. You probably mean "panel.sets" instead :

<li *ngFor="let repsCount of panel.sets">{{repsCount}}</li>

[travis haycock]

This solves my problem thank you. 

[travis haycock]

A side question i should have added part of the original is if I have for example weight array  ( weight: [300,400,130] inside the object how would I display this right beside the reps so for example:

Set One: Reps: 25  Weight: 300

Set Two: Reps: 12 Weight: 350

etc..

I understand you cannot put two *ngFor(s) inside the element unfortauntly and when trying to access this by just panel.weight it displays the weight ofcourse but not in a organised fashion & when using <li> with the *ngFor then it's separate from the Reps.

On Sunday, September 9, 2018 at 6:09:54 AM UTC-4, Christophe HOARAU wrote:

[Christophe HOARAU]

Sorry but I don't understand, I think it depends on your data schema. If both data are related they should be in an array of object [{rep: 25, weight: 300}, {rep:12, weight: 350} ...]

If they are in distinct array but you can ensure both array are related (same length and same order) then you could use index of the for loop to retrieve data from the second array.

This is not an angular question it's a generic programming question.