Search code examples
angularjsangularjs-ng-optionsangularjs-ng-model

AngularJS ng-options get selected item as an object


I have an object array in my scope and I list them in a dropdown control like below.

 <select ng-model="selectedItem" ng-options="product.ID as product.Name for product in products">
     <option value="">Please select a product...</option>
 </select>

I also want to get the selectedItem as an object to reach other attributes of the object so I can manupulate the content in my page. For example;

<a ng-show="selectedItem.isAvailable">Buy Now!</a>

Can anyone help me with this? Thank you.


Solution

  • You just need to remove select as part from the ng-options, so that the selected product will be the ngModel, selectedItem.

    Try:-

     <select ng-model="selectedItem" ng-options="product.Name for product in products track by product.id">
         <option value="">Please select a product...</option>
     </select>
    

    Your current syntax is select as label for value in array where select is the product.ID, so you would just change it to label for value in array