У меня JSON вот так
{
"cars":[
{
"id":"012",
"model":"honda",
"parts":[
{
"id":"p1",
"name":"tyre",
},
{
"id":"p2",
"name":"muffler",
}
]
},
{
"id":"022",
"model":"vw",
"parts":[
]
}
]
}
Я новичок в AngularJS, и у меня есть два выпадающих списка, DROPDOWN1, показывающие модели автомобилей, такие как:
DROPDOWN1
honda
vw
и DROPDOWN2, который должен быть загружен частями для выбранной модели автомобиля в DROPDOWN1. Например, если я выбрал "honda" в DROPDOWN1, DROPDOWN2 должен быть загружен:
DROPDOWN2
tyre
muffler
Если я выберу "vw" в DROPDOWN1, то DROPDOWN2 не будет загружаться, так как для VW нет частей.
У меня есть html с 2 select (выпадающие списки), как это, обратите внимание, что я использую ng-options, а не повторяю:
<p><strong>Select a car</strong></p>
<select
required
ng-change="selectCarAction()"
ng-model="selectCar"
ng-options="car.model for car in cars track by car.id">
<option value="" label="Select a car"></option>
</select>
<p><strong>Select a part</strong></p>
<select
required
ng-model="selectPart"
ng-options="part.name for part in parts track by part.id">
<option value="" label="Select a part"></option>
</select>
И в моем js файле я получаю данные ответа на автомобиль, например:
$scope.myData= JSON.stringify(myresponse.data);
$scope.cars= myData.data.cars;
то у меня есть функция, чтобы получить выбранный автомобиль, и намерение также загрузить DROPDOWN2, как только я получу выбранный автомобиль:
$scope.selectCarAction = function(){
if ($scope.selectCar == null){
console.log("You selected car: N/A");
} else {
console.log("You selected car: " + $scope.selectCar.model);
$scope.parts= $scope.selectCar.parts;
}
};
Пока мой DROPDOWN1 загружается нормально, мой DROPDOWN2 никогда не загружается, а в функции js выше, мои $ scope.parts получают части. Как загрузить их в свой DROPDOWN2?
Исправлено исходное сообщение. Я использовал "part in car.part" вместо "part in parts" в моем ng-варианте выше. Это определило проблему.