How to store only ID in dropdown Bootstrap

Question

<div class="form-group">                           
    <label for="title" class="col-sm-2 control-label">Section Id</label>
    <div class="col-sm-10">
        <select ng-model="product.sectionId" class="form-control" ng-options="section.name for section in sections track by section.id">
        </select>
    </div>
</div>

This is my code, I populate the sections object via JSON and section has id,name. I want to store only section.id in my product.sectionId but it stores both section id and name as below "sectionId":{"id":"Iron Man","name":"Superman"}. I want only the id to be stored. Is there a way to do that. Im new to bootstrap and angularjs please help me. thank you

Answer 1

Change your ng-option to

Markup

ng-options="section.id as section.name for section in sections"

This will should section.name and select section.id when you select any of the option.

Direct From Docs

Do not use select as and track by in the same expression. They are not designed to work together.