У меня есть файл JSON со следующей структурой
{
"regions": [
"Africa",
"The Americas",
"Asia",
"Europe",
"Middle East"
],
"countries": {
"Africa": [
"Algeria",
"Egypt",
"Morocco",
"South Africa",
"Tunisia",
"Other African Countries"
],
"Asia": [
"China",
"Japan",
"Other Asian Countries"
],
"Europe": [
"Austria",
"Baltic States - Lithuania, Latvia, Estonia",
"Belgium",
"Bulgaria",
"Croatia",
"Czech Republic",
"Denmark",
"Finland",
"France",
"Germany",
"Greece",
"Hungary",
"Iceland",
"Ireland",
"Italy",
"Luxemburg",
"Netherlands",
"Norway",
"Poland",
"Portugal",
"Romania",
"Russia",
"Slovakia",
"Slovenia",
"Spain",
"Sweden",
"Switzerland",
"Ukraine",
"United Kingdom",
"Other European Countries"
],
"Middle East": [
"Afghanistan",
"Armenia",
"Azerbaidjan",
"Bahrain",
"Georgia",
"Iran",
"Iraq",
"Israel",
"Jordan",
"Kazakhstan",
"Kuwait",
"Kyrgyzstan",
"Lebanon",
"Mongolia",
"Oman",
"Qatar",
"Saudi Arabia",
"Tadzhikistan",
"Turkey",
"United Arab Emirates",
"Uzbekistan",
"Yemen",
"Other Middle-East Countries"
]
}
Мне нужно создать два зависимых выбора. Во-первых - я выбираю регион, а по региону - выбираю выбранные страны.
HTML
<html lang="en" ng-app="myapp">
<head>
<link rel="stylesheet" type="text/css" href="css/styles.css">
</head>
<body>
<div ng-controller="myCtrl">
<select ng-model="selectedRegion" data-ng-options="location for location in selected.regions">
<option value="">Region</option>
</select>
<select ng-model="selectedCountry" ng-options="place for place in selected.countries.selectedRegion">
<option value="">Country</option>
</select>
</div>
</body>
</html>
Conroller
angular.module('myApp').controller('myCtrl', function($http, $scope) {
$http.get('contacts.json').success(function (data) {
$scope.select = data;
});
});
Второй выбор не работает. Пожалуйста помоги. Благодарю. Вот плукер - http://plnkr.co/edit/1AZNUyiRJclF7cdFOLjA?p=preview
Вам необходимо добавить свойство для региона внутри стран и, поскольку оно используется переменной []
:
<select data-ng-options="place for place in selected.countries[selectedRegion]" ng-model="..">