![](/img/trans.png)
[英]angularjs - ng-options with nested json based on previous select option
[英]angularjs ng-options nested json data
我正在为我的 Web 应用程序使用 AngularJS。 我的目标是使用ng-options
有两个下拉列表。
作为 AngularJS 的新手,我能够显示数据但整个对象显示为单个选项,我无法拆分每个数据。
请在下面找到我使用的代码。
<select ng-model="selectedRegion" ng-options="region.countryName for region in eyebrow.regionSelector"></select>
<select ng-model="selectedRegion.selectLang" ng-options= "selectedRegion.selectLang for region in selectedRegion track by selectedRegion.countryName"></select>
angular.module ('appngOption')
.controller ('headerController', function($scope) {
$scope.eyebrow = { regionSelector: [
{
"id": 1,
"countryName": "Belgium",
"selectLang": ["Dutch", "English", "French"]
},{
"id": 2,
"countryName": "France",
"selectLang": ["English", "French"]
}]}
});
示例:在选择比利时时,荷兰语,英语和法语应该是每个单独的下拉选项。 & English and French should be each separate dropdown option when France is selected.
请查看代码,如果我遗漏了什么,请告诉我。 非常感谢您的帮助。
我修复了您代码中的一些问题。
第一个输入是正确的:
<select ng-model="selectedRegion" ng-options="region.countryName for region in eyebrow.regionSelector"></select>
但在第二部分,我改变了几件事:
ng-model
设置为不同的变量( selectLang
),它更干净。ng-options
在selectedRegion.regionSelector
循环,而不仅仅是selectedRegion
。 这是你的主要错误:<select ng-model="selectLang" ng-options="lang for lang in selectedRegion.selectLang"></select>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.