Я использую AngularJS $ http для заполнения раскрывающегося списка из веб-службы. Он работает нормально, если ответ не имеет только 1 значение (например, обрезки автомобиля).
HTML:
<select ng-model="carYear" ng-options="item.value for item in cars.years" ng-change="updateDdl('make',carYear.value);" >
<option value="">Select Year</option>
</select>
<select ng-model="carMake" ng-show="cars.makes.length > 0" ng-options="item.value for item in cars.makes" ng-change="updateDdl('model',carMake.value);">
<option value="">Select Make</option>
</select>
<select ng-model="carModel" ng-show="cars.models.length > 0" ng-options="item.value for item in cars.models" ng-change="updateDdl('trim',carModel.value);">
<option value="">Select Model</option>
</select>
JS:
angular.module('carData', []).controller('carCtrl', function ($scope, $http) {
$scope.baseWebAPI = 'https://www.fueleconomy.gov/ws/rest/vehicle/';
$scope.cars = {};
$scope.car = {};
$http({
method: 'GET',
url: $scope.baseWebAPI + '/menu/year'
}).then(function (result) {
$scope.cars.years = result.data.menuItem;
});
$scope.updateDdl = function(t,i){
switch (t) {
case "make":
$scope.selectedCarYear = i;
$scope.webAPI = $scope.baseWebAPI + 'menu/make?year='+i;
break;
case "model":
$scope.selectedCarMake = i;
$scope.webAPI = $scope.baseWebAPI + 'menu/model?year='+$scope.selectedCarYear+'&make='+i;
break;
case "trim":
$scope.selectedCarModel = i;
$scope.webAPI = $scope.baseWebAPI + 'menu/options?year='+$scope.selectedCarYear+'&make='+$scope.selectedCarMake+'&model='+i;
break;
}
$http({
method: 'GET',
url: $scope.webAPI
}).then(function (result) {
switch (t) {
case "make":
$scope.cars.makes = result.data.menuItem;
break;
case "model":
$scope.cars.models = result.data.menuItem;
break;
case "trim":
$scope.cars.trims = result.data.menuItem;
console.log($scope.cars.trims);
break;
}
});
};
Поля Year, Make, Manf работают нормально, но обрезка завершается ошибкой, если есть только 1 тип обрезки без каких-либо ошибок.