Ezequiel Ramiro Ezequiel Ramiro -4 years ago 67
AngularJS Question

How to get a value in cascade selects with AngularJS?

I've go a list of states and cities like this:

var complejos = {
'Buenos Aires': {
'25 de Mayo': [],
'3 de febrero': [],
'A. Alsina': [],
'A. Gonzáles Cháves': [],
'Aguas Verdes': [],
'Alberti': [],
'Arrecifes': [],
'Ayacucho': [],
'Azul': [],
'Bahía Blanca': []},
'Capital Federal': {
'Agronomía': [],
'Almagro': [],
'Balvanera': [],
'Barracas': [],
'Belgrano': [],
'Boca': [],
'Boedo': [],
'Caballito': []}

In my code, I have two
, one to the user be able to select their state and after that their city. Example: Buenos Aires -> 3 de febrero.

I've got the following code:

<select id="state" ng-model="cities" ng-options="state for (state, cities) in complejos">
<option value=''>Choose a state</option>

<select id="city" ng-disabled="!cities" ng-model="field" ng-options="city for (city, fields) in cities">
<option value=''>Pick a city</option>

Works fine, the only problem is that I cannot get the selected values. Instead I get the whole object with a "hashkey value" (
$$hashkey: object:116

How can I use that hashkey to search my result?

Answer Source

In your second <select>, just change

ng-options="city for (city, fields) in cities">


ng-options="city as city for (city, fields) in cities">

Working JSFiddle

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download