我正在开发一个应该填充了4个选择框的应用程序，从json通过$http指令获取功能，使用ng-options和ng-filter指令。
问题是我在控制台中没有错误，但选择始终为空。
这是app获取的json数组的一部分示例：
[{"sede":"Poser Hairdressing","professionista":"Lavorante 2","day":"2017-07-31","time":"15:00"},{"sede":"Poser Hairdressing","professionista":"Lavorante 2","day":"2017-07-31","time":"15:30"}]
这是我的代码：
var app = angular.module("myApp", []);
app.controller("myCtrl", function($http, $scope) {
$scope.firstName = "John";
$scope.lastName = "Doe";
console.log("JavaScript Function");
var firstName = "John";
var lastName = "Doe";
$scope.submit = function() {
console.log("Submit");
}
var attivita = <?php echo json_encode($cod_attivita); ?>;
var config = {
transformResponse: function (data, headers) {
var result = {
events: [],
events2: [],
events3: [],
schedules: [],
schedules2: [],
schedules3: []
};
console.log(data);
var events = JSON.parse(data);
console.log(events);
var events2 = JSON.parse(data);
var events3 = JSON.parse(data);
var dates = [];
var sedi = [];
var professionisti = [];
console.log("qua3");
for (var i = 0; i < events.length; i++) {
if (dates.indexOf(events[i].day) === -1) {
var date = events[i].day;
dates.push(date);
result.events.push({
date: date
});
}
if (sedi.indexOf(events[i].sede) === -1) {
var sede = events[i].sede;
sedi.push(sede);
result.events2.push({
sede: sede
});
}
if (professionisti.indexOf(events[i].professionista) === -1) {
var professionista = events[i].professionista;
professionisti.push(professionista);
result.events3.push({
professionista: professionista
});
}
var a = 0;
var found = false;
while (a < result.schedules2.length) {
if (events[i].sede === result.schedules2[a].sede && events[i].professionista === result.schedules2[a].professionista) {
found = true;
}
a++;
}
if (found == false) {
result.schedules2.push({
sede: events[i].sede,
professionista: events[i].professionista
});
}
var a = 0;
var found = false;
while (a < result.schedules3.length) {
if (events[i].sede === result.schedules3[a].sede && events[i].professionista === result.schedules3[a].professionista && events[i].day === result.schedules3[a].date) {
found = true;
}
a++;
}
if (found == false) {
console.log("OLEE");
result.schedules3.push({
sede: events[i].sede,
professionista: events[i].professionista,
date: events[i].day
});
}
result.schedules.push({
sede: events[i].sede,
professionista: events[i].professionista,
date: events[i].day,
time: events[i].time
//console.log("qua4");
});
}
console.log(result);
return result;
}
};
var email = "assistenza@pgdue.com";
var link = 'http://sviluppo.pgdue.com/shuttle/admin/app-service/get-orari?e='+email+"&attivita="+attivita;
console.log(link);
return $http.get(link, config)
.then(getEventsCompleted)
.catch(getEventsFailed);
function getEventsCompleted(response) {
console.log(response.data);
return response.data;
console.log(response.data);
}
function getEventsFailed(error) {
console.error(error);
}
});<div ng-app="App">
<div align="center" ng-controller="TimesController as ctrl">
<p style="font-size: 22px;">Inserisci appuntamento</p>
<br>
<div class="list" align="center">
<div class="input-label">
</div>
<select style="width: 75%;" ng-options="event as event.sede for event in ctrl.data.events2" ng-model="ctrl.form.sede">
<option value="" disabled>Seleziona sede</option>
</select>
</div><br>
<div class="list" align="center">
<div class="input-label">
</div>
<select style="width: 75%;" ng-options="schedule as schedule.professionista for schedule in ctrl.data.schedules2| filter: { sede: ctrl.form.sede.sede}" ng-model="ctrl.form.professionista" ng-disabled="!ctrl.form.sede">
<option value="" disabled>Seleziona professionista</option>
</select>
</div><br>
<div class="list" align="center">
<div class="input-label">
</div>
<select style="width: 75%;" ng-options="schedule as schedule.date for schedule in ctrl.data.schedules3| filter: { professionista: ctrl.form.professionista.professionista, sede: ctrl.form.sede.sede}" ng-model="ctrl.form.giorno" ng-disabled="!ctrl.form.professionista">
<option value="" disabled>Seleziona giorno</option>
</select>
</div><br>
<div class="list" align="center">
<div class="input-label">
</div>
<select style="width: 75%;" ng-options="schedule as schedule.time for schedule in ctrl.data.schedules| filter: { date: ctrl.form.giorno.date, professionista: ctrl.form.professionista.professionista, sede: ctrl.form.sede.sede}" ng-model="ctrl.form.ora" ng-disabled="!ctrl.form.giorno">
<option value="" disabled>Seleziona orario</option>
</select>
</div><br>
</div>
</div>
<br>
<div align="right">
<button ng-click="ctrl.submit()"><p>Prenota</p></button>
</div>
<!-- begin snippet: js hide: false console: true babel: false -->
有人可以帮助我吗？
感谢＆＃39; S
答案 0 :(得分：0)
<!DOCTYPE html>
<html lang="en-US">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<select ng-options="event as event.sede for event in option1" ng-model="selected" ng-change="myfunctn()">
<option value="" disabled>Seleziona sede</option>
</select>
</div>
</body>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.option1 = [{"sede":"Poser Hairdressing","professionista":"Lavorante 2","day":"2017-07-31","time":"15:00"},
]
$scope.myfunctn = function(){
console.log($scope.selected)
}
});
</script>
</html>
答案 1 :(得分：0)
试试这个。希望它对你有用。
<select
ng-options="x as x.sede for x in option1 track by x.sede"
ng-model="selected"
ng-change="myfunctn()">
<option value="" >Seleziona sede</option>
</select>
参见示例in plunker