基于使用angular在下拉列表中选择的对象，迭代对象内部的对象

iterate object inside objects based on objecte selected inside dropdown using angular?

本文关键字：对象 迭代 内部 选择 于使用 angular 下拉列表      更新时间：2023-09-26

这是我的json:

{
    "heavy vehicles": {
        "trucks": [
            "tata",
            "jvc"
         ]
    },
    "light vehicles": {
        "cars": [
            "alto",
            "wagonr"
        ],
        "jeeps": [
            "abc",
            "def"
         ]
    },
}

我想做的是：他们有三个下拉列表，一个是有选择车辆类型的值：选项是重型和轻型车辆，第二个下拉列表应该根据所选车辆类型填充值。

我能够在一个下拉列表中迭代第一级对象，如何根据第一级中选择的下拉列表迭代第二级

所有数据都是动态的，任何级别的值都可以更改

好心帮助

我的js代码：

processList = [];
for (var key in response) {      
                        if (response.hasOwnProperty(key))
                        processList.push(key);
                        console.log("object" +  processList);
                        }

这样尝试。

var app = angular.module("app",[]);
app.controller("MyCtrl" , function($scope){
  
  $scope.data = {
    "heavy vehicles": {
        "trucks": [
            "tata",
            "jvc"
         ]
    },
    "light vehicles": {
        "cars": [
            "alto",
            "wagonr"
        ],
        "jeeps": [
            "abc",
            "def"
         ]
    },
};
  
  $scope.initSelect2 = function(key){
    $scope.select2 = [];
      angular.forEach($scope.data,function(v,k){
          if(key === k)
            $scope.select2.push(v);
        });
    }
  
  $scope.initSelect3 = function(key1,key2){
      $scope.select3 = [];
      angular.forEach($scope.data,function(v,k){
          if(key1 === k)
           {
             angular.forEach(v,function(v1,k1){
                 if(key2 === k1)
                   $scope.select3.push(v1);
               })
           }
        });
    }
  
  });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="MyCtrl">
   
  <select ng-model="model1" ng-options="key as key for (key,value) in data" ng-change="initSelect2(model1)"></select>
  <select ng-model="model2" ng-options="key1 as key1 for (key1,value1) in select2[0]" ng-change="initSelect3(model1,model2)"></select>
    <select ng-model="model3" ng-options="key2 as key2 for key2 in select3[0]"></select>
  
</div>

相关文章：