title: Show a dropdown based on proper selected radio button
body: <h2><strong>Question:</strong></h2>
  
  <p>How do I show all radio buttons but only one dropdown. This shown dropdown is one that reflects the  currently selected radiobtn?</p>
  
  <p><a href="http://jsfiddle.net/nidhishkrishnan/z8wzkojf/" rel="nofollow">Live Code</a></p>
  
  <p><strong>Html:</strong></p>
  
  <pre><code>&lt;form ng-app="app" ng-controller="Ctrl"&gt;
      &lt;div class="color-pick" ng-repeat="(key, val) in productData.colors_and_sizes.data"&gt;
          &lt;input type="radio" name="colors" ng-model="myColor" ng-value="{{key}}" /&gt;{{key}}
          &lt;div class="size-pick"&gt;
              &lt;select ng-model="mySize" ng-options="size for size in val.sizes.split(',')"&gt;&lt;/select&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p><strong>javascript:</strong></p>
  
  <pre><code>var app = angular.module("app", []);
  
  app.controller('Ctrl', function ($scope, $filter, $http) {
   $scope.productData = {
    "colors_and_sizes": {
      "data": {
        "Black": {
          "sizes": "X Small, Small, Medium, Large, Xlarge, XX Large"
        },
        "Blue": {
          "sizes": "X Small, Small, Medium, Large, Xlarge, XX Large"
        }
      }
    }
  };
  
  });
  </code></pre>