Search code examples
angularjsobjectng-optionsangularjs-ng-options

AngularJS ng-options from an object with objects


I am attempting to have my data show up in the list as follows:

<option value="4351">Atlanta</option>

Here is my object.

$scope.cityList = {
    4351:{name:"Atlanta", short="atlanta"},
    7355:{name:"Baltimore", short="baltimore"},
    1212:{name:"Chicago", short="chicago"},
    4398:{name:"Dallas", short="dallas"}
};

HTML
This worked with just key-value pairs, but now the "value" is an object

<select class="select-city" ng-model="myCity" ng-options="name for (city, name) in cityList"></select>

So my question is this:
How can I populate the ng-options in this case?


Solution

  • Use name.name for (city, name) in cityList - the name.name in this case refers to the name property of the new object you introduced, which itself is unfortunately named name.

    The documentation is a bit mystic but you can perhaps also rename it to something like value.name for (key, value) in cityList.