AngularJS选择ng选项

Question

我正在开发一个应用程序，应该有一个与JSON数组填充dinamically选择框的窗体。

我的问题是，控制器正确执行，但选择选项没有从控制器填充，有空。

这个id我的代码：

<script> 
     angular.module('ionicApp', [ 
     ]) 
     .controller('TimesController', function() { 
      console.log("JavaScript Function"); 
      var data = <?php echo $json; ?>; 
      console.log(data); 
      var result = { 
       events: [], 
       events2: [], 
       events3: [], 
       schedules: [], 
       schedules2: [], 
       schedules3: [] 
      }; 
      var events = data; 
      //console.log("events"); 
      //console.log(events); 
      var events2 = data; 
      var events3 = 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); 
     }) 
     </script> 

     <div ng-app="ionicApp" ng-controller="TimesController as ctrl"> 
      <div align="center"> 
       <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> 

有人可以帮助我解决这个问题？

感谢的

Answer 1

angular.module('app', []).controller('MyCtrl', function ($scope) { 
 
    
 
    $scope.list = [{ 
 
     id: 27, 
 
     name: "loruth water point", 
 
     latitude: 4.453488123, 
 
     longitude: 35.36021409 
 
    }, { 
 
     id: 28, 
 
     name: "kibish", 
 
     latitude: 5.286289986, 
 
     longitude: 35.82917452 
 
    }, { 
 
     id: 30, 
 
     name: "Ekalale", 
 
     latitude: 4.434588531, 
 
     longitude: 35.72135923 
 
    }, { 
 
     id: 34, 
 
     name: "karubangorok", 
 
     latitude: 4.506236007, 
 
     longitude: 35.4201746 
 
    }, { 
 
     id: 35, 
 
     name: "nakitoe kakumon", 
 
     latitude: 4.214576564, 
 
     longitude: 35.35912495 
 
    }, { 
 
     id: 36, 
 
     name: "kaikor mission", 
 
     latitude: 4.516645656, 
 
     longitude: 35.42262991 
 
    }]; 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="app"> 
 
    <div ng-controller="MyCtrl"> 
 
     <h2>List:</h2> 
 
<p> 
 
     <select ng-model="selectedItem" ng-options="item.name for item in list"> 
 
      <option value="">-- choose --</option> 
 
     </select> 
 
     
 
    </p> 
 
     <p> 
 
      <h2>Selected:</h2> 
 
      {{selectedItem.name}} 
 
     </p> 
 
    </div> 
 
</div>

检查一次这个例子。