Search code examples
javascriptangularjsangularjs-ng-repeatng-options

How to fill dropdown by matching key from array inside ng repeat?


I am having json structure like this:

101 :
     "List": [
      {
        "Name": "Pink"
      },
      {
        "Name": "Black"
      }
    ]

102 :
     "List": [
      {
        "Name": "Red"
      },
      {
        "Name": "Yellow"
      }
    ]

$scope.Ids = [101,102,103,104];

Now i have 1 ng repeat loop looping on the List of Ids (For eg:101,102) and so i want to fill dropdown by specific Id.For eg for Id 101 i would like to fill Pink,Black and for 102 i would like to fill Red,Yellow in my dropdown and for rest i would like to simply ignore but i am not getting how to achieve this.

code:

<div ng-repeat="item in Ids track by item.id">
  <select ng-model="color" ng-options="">
         <option value="">-- choose color --</option>
      </select>
</div>

Solution

  • Assume the dropdown map is stored in an object: $scope.map:

    <div ng-repeat="id in Ids">
      <select ng-model="color" ng-options="opt.name for opt in map[id].list"></select>
    </div>