angularjs ng-options键值对3级深

时间:2017-04-30 11:15:37

标签: angularjs ng-options angularjs-ng-options

我有一个问题,我无法在ng-options中制作3级深度,我能够将工作深入到2级

这是我的代码

控制器

$scope.names = {
            'Technology': [
                'Personal Computer',
                'Mobile Phone',
                'Console Game'
            ],
            'Healthcare': [
                'Blood Donation',
                'Injection',
                'Medical Care'
            ],
            'Housing': [
                'Repairs',
                'Gardening',
                'Plumbing',
                'Laundry'
            ]    
        };

HTML

<select ng-model="selectedName" ng-options="x for (x, y) in names">
</select>

<select ng-model="selectedNames" ng-options="x for x in selectedName">
</select>

这是有效但只有2级深,我需要的是3级深度。

所以$ scope.names就像这样

控制器

$scope.names = {
            'Technology': [
                'Personal Computer': [
                    'some data', 
                    'some data'
                    ],
                'Mobile Phone': [
                    'some data', 
                    'some data'
                    ],
                'Console Game': [
                    'some data', 
                    'some data'
                    ]
            ],
            'Healthcare': [
                'Blood Donation': [
                    'some data', 
                    'some data'
                    ],
                'Injection': [
                    'some data', 
                    'some data'
                    ],
                'Medical Care': [
                    'some data', 
                    'some data'
                    ]
            ],
            'Housing': [
                'Repairs': [
                    'some data', 
                    'some data'
                    ],
                'Gardening': [
                    'some data', 
                    'some data'
                    ],
                'Plumbing': [
                    'some data', 
                    'some data'
                    ],
                'Laundry': [
                    'some data', 
                    'some data'
                    ]
            ]    
        };

我如何安排我的ng选项?它没有使用ng-options="x for (x, y) in names"

显示任何内容

1 个答案:

答案 0 :(得分:0)

你在寻找像这样的东西

&#13;
&#13;
angular.module("app",[])
.controller("ctrl",function($scope){
 
 
$scope.names = {
            'Technology': {
                'Personal Computer': [
                    'some data1', 
                    'some data2'
                    ],
                'Mobile Phone': [
                    'some data3', 
                    'some data4'
                    ],
                'Console Game': [
                    'some data5', 
                    'some data6'
                    ]
            },
            'Healthcare': {
                'Blood Donation': [
                    'some data', 
                    'some data'
                    ],
                'Injection': [
                    'some data', 
                    'some data'
                    ],
                'Medical Care': [
                    'some data', 
                    'some data'
                    ]
            },
            'Housing': {
                'Repairs': [
                    'some data', 
                    'some data'
                    ],
                'Gardening': [
                    'some data', 
                    'some data'
                    ],
                'Plumbing': [
                    'some data', 
                    'some data'
                    ],
                'Laundry': [
                    'some data' , 
                    'some data'
                    ]
            }    
        };
})
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
 <select ng-model="selectedName" ng-options="x for (x, y) in names" ng-change="getKeys(selectedName)">
</select>  
{{selectedName}}
<select ng-model="selectedNames" ng-options="y as x for (x, y) in selectedName"  >
</select>
{{selectedNames}}
<select ng-model="selectedNames3" ng-options="x for x in selectedNames">
</select>
{{selectedNames3}}

</div>
&#13;
&#13;
&#13;