文字列配列を持つJSONオブジェクトでselect ng-optionsを設定するにはどうすればよいですか？

は現在、私は、このJSONオブジェクトを持っている：文字列配列を持つJSONオブジェクトでselect ng-optionsを設定するにはどうすればよいですか？

{ 
    "hospitalId" : "0002", 
    "name" : "test form", 
    "procedureId" : "0002-testform", 
    "steps" : [ 
     { 
      "title" : "Brand", 
      "value" : [ 
       "jonson", 
       "smith", 
       "braun" 
      ] 
     }, 
     { 
      "title" : "Procedure type", 
      "value" : [ 
       "total", 
       "unicompartimental" 
      ] 
     } 
    ] 
}

をそして私はこのように、複数選択の上にそれを表示する必要があります。

<strong>Brand</strong> 
<ul>braun</ul> 
<ul>jonson</ul> 
<ul>smith</ul> 

<strong>Procedure type</strong> 
<ul>total</ul> 
<ul>unicompartimental</ul>

彼らはsteps.titleによっておよびsteps.valueが発注する必要があります事はある、：

<select multiple ng-model="step" ng-options="step[0].value group by step.title for step in loadedSteps.steps " ></select>

は私を与える：私は<select ng-options>タグでそれらを正しく表示する方法を見つけ出すことはできません、これは私が試したものですブランド未定義

<select multiple ng-model="step" ng-options="step.value group by step.title for step in loadedSteps.steps | orderBy:['value']"></select>

は私を与える：ブランド [ジョンソン、スミス、ブラウン]

また

私は、ネストされた<option>で試してみたが、それは注文する必要はありません...

何か助けていただければ幸いです。ありがとうございます。

出典

2016-11-09 Camilo

ここではあなたがお探しの答えです。

を表示するには、最初にng-repeatを2つ使用し、valuesをタイトルの中に表示する必要があります。

最初のng-repeatはタイトルで始まり、そのタイトルの値で終了します。

var app = angular.module('myApp', []); 
 
app.controller('myCtrl', function($scope) { 
 
    $scope.names = 
 
{ 
 
"hospitalId": "0002", 
 
"name": "test form", 
 
"procedureId": "0002-testform", 
 
"steps": [{ 
 
    "title": "Brand", 
 
    "value": [ 
 
    "jonson", 
 
    "smith", 
 
    "braun" 
 
    ] 
 
}, { 
 
    "title": "Procedure type", 
 
    "value": [ 
 
    "total", 
 
    "unicompartimental" 
 
    ] 
 
}] 
 

 
} 
 
});

<!DOCTYPE html> 
 
<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
<body> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
<div > 
 
     <label>{{step.title}}</label> 
 
    <select> 
 
    <option ng-repeat-start="step in names.steps | orderBy:'title'" ng-bind="step.title"></option> 
 
    <option ng-repeat-end ng-repeat="opt in step.value | orderBy:'step.value':true" ng-bind="' - ' + opt"></option> 
 
    </select> 
 
    
 
    </div> 
 
</div> 
 

 

 
</body> 
 
</html>

このスニペット

HEre is a plunker

出典

2016-11-09 05:25:43 Sravan

@Camiloを実行してください、この答えをチェックしてください。 – Sravan

仲間ありがとう、それはうまく働いた、私はそれを感謝する！ – Camilo

あなたが気にしないなら、あなたは私の答えを受け入れることができます。 :) – Sravan

文字列配列を持つJSONオブジェクトでselect ng-optionsを設定するにはどうすればよいですか？

答えて

関連する問題