AngularJSでエンティティモデルを使用してラジオオプションをプルダウンから入力する

Question

エンティティフレームワークと角度を使用してラジオオプションを設定しようとしています。 JS Fiddle Example

エンティティフレームワークを使用してこれを行うにはどうすればよいですか？私は戻ってコントローラ罰金...そのだけのラジオボタンに結果を結合からのデータを持っている... EntityFrameworkJSScopeNameで

列がANIMAL_NAMEあるレコード識別子と一緒にオプション1、オプション2、オプション3、オプション4 & Option5です。ここで

コードです：

<div ng-controller="DropdownPopulation" class="form-group"> 
<label class="control-label col-sm-2" for="AnimalGrp">Copy detail from:</label> 
<div class="col-sm-10"> 
    <select class="form-control" data-ng-model="formData.animalSelected" required id="AnimalGrp" data-ng-options="c.ANIMAL_NAME as c.ANIMAL_NAME for c in EntityFrameworkJSScopeName"> 
     <option value="" selected>Select Animal</option> 
    </select> 
</div> 

<div ng-repeat="r in EntityFrameworkJSScopeName | filter: formData.animalSelected"> 
{{r.Option1}} <!-- This displays the value fine on page, either RED, AMBER or GREEN --> 
<div class="form-group"> 

    <label class="control-label col-sm-2">Option 1</label> 
    <div class="col-sm-10"> 
     <label class="radio-inline"> 
     <input type="radio" name="Option1" data-ng-model="{{r.Option1}}" value="Red">Red</label> 
     <label class="radio-inline"> 
     <input type="radio" name="Option1" data-ng-model="{{r.Option1}}" value="Amber">Amber</label> 
     <label class="radio-inline"> 
     <input type="radio" name="Option1" data-ng-model="{{r.Option1}}" value="Green">Green</label> 
    </div> 
</div> 

<div class="form-group"> 
    <label class="control-label col-sm-2">Option 2</label> 
    <div class="col-sm-10"> 
     <label class="radio-inline"> 
     <input type="radio" name="Option2" data-ng-model="{{r.Option2}}" value="Red">Red</label> 
     <label class="radio-inline"> 
     <input type="radio" name="Option2" data-ng-model="{{r.Option2}}" value="Amber">Amber</label> 
     <label class="radio-inline"> 
     <input type="radio" name="Option2" data-ng-model="{{r.Option2}}" value="Green">Green</label> 
    </div> 
</div> 

<div class="form-group"> 
    <label class="control-label col-sm-2">Option 3</label> 
    <div class="col-sm-10"> 
     <label class="radio-inline"> 
     <input type="radio" name="Option3" data-ng-model="{{r.Option3}}" value="Red">Red</label> 
     <label class="radio-inline"> 
     <input type="radio" name="Option3" data-ng-model="{{r.Option3}}" value="Amber">Amber</label> 
     <label class="radio-inline"> 
     <input type="radio" name="Option3" data-ng-model="{{r.Option3}}" value="Green">Green</label> 
    </div> 
</div> 

<div class="form-group"> 
    <label class="control-label col-sm-2">Option 4</label> 
    <div class="col-sm-10"> 
     <label class="radio-inline"> 
     <input type="radio" name="Option4" data-ng-model="{{r.Option4}}" value="Red">Red</label> 
     <label class="radio-inline"> 
     <input type="radio" name="Option4" data-ng-model="{{r.Option4}}" value="Amber">Amber</label> 
     <label class="radio-inline"> 
     <input type="radio" name="Option4" data-ng-model="{{r.Option4}}" value="Green">Green</label> 
    </div> 
</div> 

<div class="form-group"> 
    <label class="control-label col-sm-2">Option 5</label> 
    <div class="col-sm-10"> 
     <label class="radio-inline"> 
     <input type="radio" name="Option5" data-ng-model="{{r.Option5}}" value="Red">Red</label> 
     <label class="radio-inline"> 
     <input type="radio" name="Option5" data-ng-model="{{r.Option5}}" value="Amber">Amber</label> 
     <label class="radio-inline"> 
     <input type="radio" name="Option5" data-ng-model="{{r.Option5}}" value="Green">Green</label> 
    </div> 
</div> 

</div> 

Answer 1

さて私は、これは使用して私のjs.fileで$範囲の値を設定することにより、ソートを取得するために管理：

 $scope.GetRemainingRAGS = function() { 
     $http({ 
      method: 'POST', 
      url: '/Data/GetRemainingRAGS', 
      data: JSON.stringify({ ANIMAL_NAME: $scope.formData.animalSelected}) 
     }). 
      success(function (data) { 
       $scope.theColours = data; 

       //associating column values to scope on html 
       $scope.Option1 = $scope.theColours[0].Option1; 
       $scope.Option2 = $scope.theColours[0].Option2; 
       $scope.Option3 = $scope.theColours[0].Option3; 
       $scope.Option4 = $scope.theColours[0].Option4; 
       $scope.Option5 = $scope.theColours[0].Option5; 
      }) 
    }; 

そして、私のhtml ：

<div class="form-group"> 
<label class="control-label col-md-2">Option 1</label> 
<div class="col-md-3"> 
    <div> 
     <label class="radio-inline"> 
      <input type="radio" name="Option1" ng-model="Option1" value="RED">Red</label> 
     <label class="radio-inline"> 
      <input type="radio" name="Option1" ng-model="Option1" value="AMBER">Amber</label> 
     <label class="radio-inline"> 
      <input type="radio" name="Option1" ng-model="Option1" value="GREEN">Green</label> 
    </div> 
</div> 

.. 5つのオプションについて繰り返す