我想創建從JSON數據使用Angular JS級聯下拉

Question

我想創建從JSON數據使用Angular JS級聯下拉，但不能填充第二個下拉列表中的數據基於您在第一次淹沒時選擇的項目。 任何一個可以sugeest我在哪裏，我在做什麼錯誤

HTML：

<select ng-model="asset 1" id="assetNameGroup" ng-change="populateSection(this)"  ng-options=" x.name for x in Nameitems"> 
     <option value="">Select Name</option> 
    </select> 
    <select ng-model="asset2" id="assetNameGroup2" ng-  change="populateSection2()" ng-options=" x.name for x in asset1.sections"> 
    <option value="">Select Name</option> 
</select> 

JS

// Code goes here 
     var app = angular.module("myApp" ,[]); 
    app.controller('sensorsCtrl', function($scope, $state, $http) 
     alert(""); 

    $http.get(sample.json).success(function (resp) { 
     $scope.innerIsIsLoading = false; 
     $scope.assetData = resp; 


      $scope.Nameitems = []; 

      var testobj = $scope.assetData[0].name; 
     angular.forEach($scope.assetData, function(val,key) { 
     $scope.Nameitems.push ({"name": 
      val.name,"uri":val.uri,"sections": val.sections}); 
       console.log("console.log(JSON.stringify-----=                            "+JSON.stringify 
       ($scope.Nameitems)); 
      }); 
      console.log("$scope.assetData"+JSON.stringify($scope.assetData)); 

     $timeout(function() { 

      //$scope.SequenceLinkTableData=$scope.assetData; 
     }, 100); 
     }); 


     $scope.populateSection=function(value) 
     { 
      var checkvalue = value; 
       console.log(value); 

    var Namesite =        document.getElementById('assetNameGroup').value.split("/")[2]; 
     alert(Namesite); 
      } 

       }); 


       Json: 

        [{ 
      "uri": "/assets/0ff042ea-45e6-32e1-915b-81efa58e924e", 
     "name": "Asset 1", 
      "sections": [{ 
       "uri": "/assets/67dc7db3-2374-314d-8b19-6be09d4203c9", 
       "sectionId": null, 
    "name": "Section 1", 
    "ultrasonicSensors": null, 
    "temperatureSensors": null, 
    "ultrasonicSensorPositions": [{ 
     "ultrasonicSensorPositionId": 1392, 
     "sensorPositionName": "MeasurementPosition 1", 
     "diameter": 12, 
     "rotation": 270, 
     "sequenceNumber": null, 
     "sectionId": "/assets/67dc7db3-2374-314d-8b19-6be09d4203c9" 
    }, { 
     "ultrasonicSensorPositionId": 1428, 
     "sensorPositionName": "MeasurementPosition 2", 
     "diameter": 12, 
     "rotation": 270, 
     "sequenceNumber": null, 
     "sectionId": "/assets/67dc7db3-2374-314d-8b19-6be09d4203c9" 
    }] 
}, { 
    "uri": "/assets/8d2c61f7-eb3e-3170-9e0b-dc26b2b574f5", 
    "sectionId": null, 
    "name": "Section 1", 
    "ultrasonicSensors": null, 
    "temperatureSensors": null, 
    "ultrasonicSensorPositions": [{ 
     "ultrasonicSensorPositionId": 1390, 
     "sensorPositionName": "ultrasonic sensor position 1", 
     "diameter": 22.5, 
     "rotation": 90, 
     "sequenceNumber": null, 
     "sectionId": "/assets/8d2c61f7-eb3e-3170-9e0b-dc26b2b574f5" 
    }, { 
     "ultrasonicSensorPositionId": 1427, 
     "sensorPositionName": "MeasurementPosition 2", 
     "diameter": 12, 
     "rotation": 270, 
     "sequenceNumber": null, 
     "sectionId": "/assets/8d2c61f7-eb3e-3170-9e0b-dc26b2b574f5" 
    }, { 
     "ultrasonicSensorPositionId": 1445, 
     "sensorPositionName": "MeasurementPosition 3", 
     "diameter": 12, 
     "rotation": 270, 
     "sequenceNumber": null, 
     "sectionId": "/assets/8d2c61f7-eb3e-3170-9e0b-dc26b2b574f5" 
    }] 
}] 

     }] 

plunker link

Answer 1

在第二ng-options，變asset1.sections只是asset1：

ng-options="x.name for x in asset1" 

演示：https://plnkr.co/edit/r3zrGrAT4PweKw1aLpe6?p=preview