JSON에서 Angular JS ng-options를 선택하는 중

Question

select을 ng-options과 함께 사용하여 드롭 다운을 채우려 고합니다. 이것은 내 JSON입니다

{ "Food": [ { "Name": Apple, "HealthCondition": [ { "Name": "High Blood Pressure", "Eat": null }, { "Name": "High Cholesterol", "Eat": null }, { "Name": "Heart Disease", "Eat": null }, { "Name": "Osteoporosis", "Eat": null }, { "Name": "Digestive Disorder", "Eat": null } ] }

그리고이 <select class="chosen-select" ng-model="selectedValue" ng-options="x.HealthCondition for x in myResults.Food" multiple chosen></select> 내 선택이고 내가지고있어 결과가 [object Object],[object Object],[object Object],[object Object],[object Object]

내가 건강 상태 이름의 목록을 얻으려고합니다! 어떤 도움이라도 대단히 감사하겠습니다. 이것을 몇 시간 동안 우연히 보았습니다. 나는 Angular Chosen 지시어를 사용하고있다. x.Name과 같은 이름 필드를 사용하지만 HealthCondition Name을 원한다면 올바르게 작동합니다.

도움이 될 것입니다.

Answer 1

일부 관측 :

다음보기에서 다음을 사용

$scope.HealthConditions = myResults.reduce(function(arr, result){ 
    for(var i in result.HealthCondition){ 
     arr.push(result.HealthCondition[i]); 
    } 
    return arr; 
}, []); 

과

• JSON이 유효하지 않습니다. Apple은 name 키에 대한 문자열이어야합니다.
• Food 배열을 ng-options에 반복하면 HealthCondition이어야합니다.

DEMO

var myApp = angular.module('myApp',[]); 
 

 
myApp.controller('MyCtrl',function($scope) { 
 
    $scope.jsonObj = { 
 
    "Food": [ 
 
    { 
 
     "Name": "Apple", 
 
     "HealthCondition": [ 
 
     { 
 
     "Name": "High Blood Pressure", 
 
     "Eat": null 
 
     }, 
 
     { 
 
     "Name": "High Cholesterol", 
 
     "Eat": null 
 
     }, 
 
     { 
 
     "Name": "Heart Disease", 
 
     "Eat": null 
 
     }, 
 
     { 
 
     "Name": "Osteoporosis", 
 
     "Eat": null 
 
     }, 
 
     { 
 
     "Name": "Digestive Disorder", 
 
     "Eat": null 
 
     } 
 
    ] 
 
}]}; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    <select class="chosen-select" ng-model="selectedValue" ng-options="x.Name as x.Name for x in jsonObj.Food[0].HealthCondition" multiple chosen></select> 
 
</div>

Answer 2

이 문제는 데이터가 현재의 형식으로 NG-옵션을 사용할 수없는 것입니다 <select class="chosen-select" ng-model="selectedValue" ng-options="x.Name as x.Name for x in myResults.Food.HealthCondition" multiple chosen></select>

Answer 3

을보십시오. HealthCondition 배열을 속성으로하는 여러 개체 대신 단일 배열로 사용 가능한 HealthConditions를 줄여야합니다. 컨트롤러에서

당신과 같이 하나의 배열로 데이터를 매핑해야합니다

<select class="chosen-select" ng-model="selectedValue" ng-options="x.Name for x in HealthConditions" multiple chosen></select>