如何访问 Javascript 中数组内部的元素？

Question

Using Angular 7 and cannot find a solution to this issue. My end goal is for this process:

1. User selects their favorite kind of dessert in a drop down.
2. Then if the user picks ice cream another drop down will populate with a list of flavors.

Currently I have the the drop down with desserts in it and the user can select ice cream. I can console.log the large array which contains the array of flavors.

console.log(JSON.stringify(this.desserts));

Will return:

{"DESSERT_ID":"1", "DESSERT_TYPE":"ICE CREAM", "favlorresults":[{},[{"FLAVORES":"CHOCOLATE"}]] }

I can also console.log the array that contains the flavors:

console.log(JSON.stringify(this.desserts[0].favlorresults[1]));

Will return:

[{"FLAVORS":"CHOCOLATE"}]

But this returns as undefined:

console.log(JSON.stringify(this.desserts[0].favlorresults[1].FLAVORS));

I am expecting CHOCOLATE.

Drop down logic that isn't working:

 <tr *ngFor="let dessert of desserts; let i = index"> <td> <select (change)="dessertChange(i)" [(ngModel)]="dessert.DESSERT_TYPE"> <option *ngFor="let desresult of desresults; let i = index" [ngValue]="desresult.DESSERT_TYPE"> {{ desresult.DESSERT_TYPE }}</option> </select> </td> <td> <select [(ngModel)]="dessert.FLAVOR"> <option *ngFor="let favlorresult of dessert.favlorresults" [ngValue]="favlorresult.FLAVOR"> {{ favlorresult.FLAVOR }}</option> </select> </td>

Answer 1

if this.desserts[0].favlorresults[1] is an Array ( [{"FLAVORS":"CHOCOLATE"}] ), then you need to get the element (at index 0) first.

ie this.desserts[0].favlorresults[1][0].FLAVORS