5

http GET メソッドからの応答 JSON は次のとおりです。

 [
    {
        "1": "Open"
    },
    {
        "2": "Expired"
    }
]

angular jsの選択ドロップダウンボックスでこのデータをバインドする方法。私はこのオプションで試しました：

<select class="form-control" ng-model="selected" ng-options="item for item in data"> 
<option value="">----Select----</option> 
</select>

しかし、ドロップダウン リストに [object,object] が表示されます。

4

2 に答える 2

3

key,value不明または異なるキーがあるため、in ng-repeat 構文が必要です

そして、最初に配列に対して、次にオブジェクト内のキーに対して2つの繰り返しを追跡する必要があります

<select class="form-control" ng-model="selected" > 
<option value="">----Select----</option> 
   <optgroup ng-repeat="v in values">

     <option ng-repeat='(key,value) in v' value="{{key}}">{{value}}</option>
   </optgroup>  
</select>

デモ

オプションの値は "open"または " expired" になります。これをキー " 0" または " "に変更でき1ますvalue={{value}}value="{{key}}"

app = angular.module('test',[]);
app.controller('testctrl',function($scope){
$scope.values =[{"1": "Open" },{"2": "Expired" }];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-controller="testctrl" ng-app="test">
<span ng-if="selectedModel">{{selectedModel}}</span>
<select class="form-control"  ng-model="selectedModel"> 
<option>----Select----</option> 
   <optgroup ng-repeat="v in values">
     
     <option ng-repeat='(key,value) in v' value="{{value}}">{{value}}</option>
   </optgroup>  
</select>
  </div>

于 2014-12-24T10:20:29.330 に答える