CODEWITHSUNDEEP
javascriptangularjs
hencca
hencca

Reputation: 143

Angular, syncing two select elements

I'm struggling to understand binding and and select elements. I want two select elements to be synchronized. It seems as though ng-value="$index" should be the correct way, but it doesn't work.

These sync:

<select  ng-model="myVar1"><option value="{{n}}" ng-repeat="(n, o) in ['donny', 'felix', 'bob'] track by $index" >{{o}}</option></select>

{{o}}

but these dont:

<select  ng-model="myVar2"><option ng-value="$index" ng-repeat="o in ['donny', 'felix', 'bob'] track by $index" >{{o}}</option></select> <select  ng-model="myVar2"> <option ng-value="$index" ng-repeat="o in ['donny', 'felix', 'bob'] track by $index" >{{o}}</option>   </select>

JSBIN: http://jsbin.com/dirugikice/1/edit?html,js,output

What am I missing?

Upvotes: 0

Views: 524

Answers (1)

Billy
Billy

Reputation: 1104

Wrap your $index in brackets, e.g {$index}

<select  ng-model="myVar2"><option ng-value="{$index}" ng-repeat="o in ['donny', 'felix', 'bob'] track by $index" >{{o}}</option></select> <select  ng-model="myVar2"> <option ng-value="{$index}" ng-repeat="o in ['donny', 'felix', 'bob'] track by $index" >{{o}}</option>   </select>

http://jsbin.com/pubapigibi/1/edit

Upvotes: 1

Related Questions