I would like to set different text / value for a dropdown I have with angularJS. Currently both the text and the value are same by using this syntax:

<select name="flightNum" class="form-control" ng-model="model.flight"
       ng-options="v.Value as v.Text for v in flights" required></select>

I tried this approach:

<select name="flightNum" class="form-control" ng-model="model.flight"
          ng-options="v.Value as v.Text for v in flights" required>
    <option ng-repeat="v in flights" value="{{v.Value}}"> {{v.Text}}</option>
</select>

But I've got the same text/value combination. Any idea what do I need to change to make this working with angularJS?

Thanks in advance, Laziale

As long as your $scope.flights is setup properly, the first syntax you showed should work. I've setup a plunker to show this in action at http://plnkr.co/edit/PIXZZO81aQKj4kmngoXy?p=preview

It has the following data structure for $scope.flights:

  $scope.flights = [{
    value: 'val1',
    text: 'text1'
  }, {
    value: 'val2',
    text: 'text2'
  }, {
    value: 'val3',
    text: 'text3 '
  }]

Then, the select can be written essentially as you have it (i used lowercase value and text on accident, but just make sure it matches between the controller and the html):

<select name="flightNum" class="form-control" ng-model="model.flight" ng-options="v.value as v.text for v in flights" required></select>

With this setup, the dropdown is populated with the values contained in the "text" fields, but selecting something sets the "value" into the model.flight variable. You can see this in the Plunker mentioned above.

Is this the behavior you're wanting? If not, what is happening that is different/unexpected?

more