Currently, I am utilizing AngularJS and have created an object that contains a size property storing an array of objects.
var product = [
// ..
sizes: [
{choice: 'one', order: 1},
{choice: 'two', order: 2},
{choice: 'three', order: 3}
]
//..
];
In the view section, I am generating a select box as follows:
<select ng-init="size = product.sizes[0]" ng-options="size.choice for size in product.sizes" ng-model="size"></select>
Although this setup is functional, when I attempt to fetch the currently selected value using a button, it returns undefined: alert($scope.size);
I have replicated the issue here. Additionally, just for entertainment purposes, I recreated a similar scenario (?) in another CodePen here.
The second example functions as intended, whereas the first one does not. Even though I created both, I am unable to determine why one works while the other does not.