получить значение из вложенного массива json angular

Question

Я пытаюсь получить значение из вложенного массива. Как-то я не смог получить значение.

Вот мой JSON

                {
        "VersionNum": "",
        "studyLevel": [{
                "countryName": "StudyLevel",
                "FS": "15-JAN-2020",
                "LS": "10-Jan-2020",
                "FI": "08-DEC-2019",
                "LI": "10-FEB-2019",
                "getData": [{
                        "countryId": 0,
                        "userId": "4",
                        "Username": "Vimal",
                        "FI": "12-JAN-2020",
                        "LI": "21-Feb-2020",
                        "experience": 5
                    },
                    {
                        "countryId": 0,
                        "userId": "5",
                        "Username": "Jack",
                        "FI": "12-JAN-2020",
                        "LI": "21-Feb-2020",
                        "experience": 3
                    },
                    {
                        "countryId": 0,
                        "userId": "6",
                        "Username": "James",
                        "FI": "12-JAN-2020",
                        "LI": "21-Feb-2020",
                        "experience": 1
                    }
                ]
            },
            {
                "countryName": "Country 1",
                "FS": "15-JAN-2020",
                "LS": "10-Jan-2020",
                "FI": "08-DEC-2019",
                "LI": "10-FEB-2019",
                "getData": [{
                        "countryId": 0,
                        "userId": "4",
                        "Username": "Paul",
                        "FI": "12-JAN-2020",
                        "LI": "21-Feb-2020",
                        "experience": 5
                    },
                    {
                        "countryId": 0,
                        "userId": "4",
                        "Username": "Smith",
                        "FI": "12-JAN-2020",
                        "LI": "21-Feb-2020",
                        "experience": 5
                    },
                    {
                        "countryId": 0,
                        "userId": "4",
                        "Username": "Trumble",
                        "FI": "12-JAN-2020",
                        "LI": "21-Feb-2020",
                        "experience": 5
                    }
                ]
            }
        ]
    }

Я пытаюсь получить доступ к имени пользователя из getData Вот мой код ts

const getUserData = this.dataService.getuserList().subscribe((data:any) => {
  console.log(data);
  this.reponsearray = data;   
  this.responseuserName = data.getData[0].Username;   
});

Вот мой HTML

      <ng-container *ngFor="let item of responseuserName ">
           <th  [attr.colspan]="keycount" class="User-names">{{item.userName}}</th>
      </ng-container>

Пожалуйста, дайте мне знать, что я здесь не так делаю.

Answer 1

вы можете попробовать вот так. здесь, как вы можете видеть, у нас есть массив объектов studyLevel, а внутри у нас есть еще один массив объектов getData, поэтому мы используем два *ngFor l oop один внутри другого

TS

const getUserData = this.dataService.getuserList().subscribe((data:any) => {
  console.log(data);
  this.responseuserName = data.studyLevel;   
});

HTML

 <ng-container *ngFor="let item of responseuserName ">
     <ng-container *ngFor="let data of intem. getData >
           <th  [attr.colspan]="keycount" class="User-names">
{{data.userName}}</th>
     </ng-container>
 </ng-container>

Answer 2

studyLevel массив имеет нужные данные:

const getUserData = this.dataService.getuserList().subscribe((data:any) => {
  console.log(data);
  this.reponsearray = data;   
  this.responseuserName = data.studyLevel[0].getData[0].Username;   
});

ОБНОВЛЕНИЕ:

Вы можете создать вложенный *ngFor:

<div *ngFor="let row of response.studyLevel">
  <div *ngFor="let col of row.getData">
    {{col.Username}} {{col.FI}} {{col.LI}}
  </div>
</div>

В качестве рекомендации вы можете переименовать responseuserName в responseuserNames.

Пример рабочего стекаблица можно увидеть здесь.