How to get corresponding array of objects of dropdown selected value as list?

Question

I have a basic dropdown which contains array of objects (countries), and for each object there would be array of objects (cities). So, if I select a country in a dropdown, I have to display the list of cities in that object on ng-change.

Here is my code:

JavaScript:

   $scope.data = [
   {
  "id": 1,
  "countryName": "India",
  "cities": [
    {
        "id": 11,
        "cityName": "hyderabad"
    },
    {
        "id": 12,
        "cityName": "Bengaluru"
    },
    {
        "id": 13,
        "cityName": "Mumbai"
    },
    {
        "id": 14,
        "cityName": "Delhi"
    }
   ]
 },
{
  "id": 2,
  "countryName": "Afghanisthan",
  "cities": [
    {
        "id": 21,
        "cityName": "kabul"
    },
    {
        "id": 22,
        "cityName": "kandahar",
    },
    {
        "id": 23,
        "cityName": "herat"
    }
  ]
},
{
  "id": 3,
  "countryName": "Alaska",
  "cities": [
    {
        "id": 31,
        "cityName": "Fairbanks"
    },
    {
        "id": 32,
        "cityName": "Juneau"
    },
    {
        "id": 33,
        "cityName": "Anchorage"
    }
  ]
}
]

Html:

        <select>
            <option ng-repeat="user in data | filter:search:strict" ng-
       click="selectedItem()">{{user.countryName}}</option>

        </select>

yBrodsky · Accepted Answer · 2017-04-17 14:16:58Z

1

<select ng-options="n as n.countryName for n in data" ng-model="selected">      
  </select>
<ul>
  <li ng-repeat="n in selected.cities">
    {{n.cityName}}
  </li>
</ul>

edited Apr 17, 2017 at 14:16

answered Apr 17, 2017 at 14:13

yBrodsky

5,0614 gold badges24 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

anub Over a year ago

No,Actually in first select when I clicked on country,I have to display the corresponding cities of that country as list.

Collectives™ on Stack Overflow

How to get corresponding array of objects of dropdown selected value as list?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related