ng-Optionen funktioniert nicht in wählen

Question

Ich versuche, eine Auswahl in meiner eckigen App zu implementieren, um Daten über TV-Show-Episoden in einer Tabelle anzuzeigen.

In der Auswahl sollte der Benutzer in der Lage sein, eine der Episoden auszuwählen.

Ich versuchte von ng-repeat die Option Elemente, die funktionierte. Aber wenn ich versuche, ng-options für die Auswahl zu setzen, scheinen sie nicht erkannt zu werden.

Irgendeine Idee, was ich hier falsch gemacht habe?

Hier ist mein html:

<div class="container-fluid full-height"> 
    <div id="tabs_container" class="col-xs-12"> 


     <div ng-app="seriesAnalyzer" ng-controller="configTableController"> 
      <label> 
       Episode: 
       <select> 
        <option ng-repeat="episode in all_episodes | orderBy:['season_number','episode_number']">Season: {{episode.season_number}} Episode: {{episode.episode_number}}</option> 
       </select> 
      </label> 

      <!-- This is not working --> 
      <label> 
       Episode: 
       <select ng-options="episode.season_number for episode in all_episodes track by id"> 
        <option value="">Please select an episode...</option> 
       </select> 
      </label> 

      <div ng-init="episode = episode_data"> 
       <p>{{episode_data.episode_number}}</p> 
       <p>{{episode_data.season_number}}</p> 
      </div> 

      <table st-table="rowCollection" class="table table-striped"> 
       <thead></thead> 
       <tbody> 
       <tr ng-repeat="scene in episode_data.configuration_matrix"> 
        <td ng-repeat="values in scene track by $index" ng-style="set_color(values)" >{{values}}</td> 
       </tr> 
       </tbody> 
      </table> 

     </div> 

     <br> 
    </div> 
</div> 

Und mein Controller:

seriesAnalyzer.controller('configTableController', function ($scope, $http) { 

var req_url = 'http://localhost:8080/api/episodes'; 
$http.get(req_url) 
    .success(function (data) { 
     $scope.all_episodes = data; 
     console.log($scope.all_episodes); 
    }) 
    .error(function (data) { 
     console.log('Error: ' + data); 
    }); 


$scope.update_season_number = function(){ 
    console.log(val); 
}; 

$scope.update_episode_number = function(){ 
    console.log("Input changed"); 
}; 

var get_episode_data = function() 
{ 
    var req_url = 'http://localhost:8080/api/episodes?season_id=' + $scope.season_number + '&episode_id=' + $scope.episode_number 
    $http.get(req_url) 
     .success(function (data) { 
      $scope.episode_data = data; 
     }) 
     .error(function (data) { 
      console.log('Error: ' + data); 
     }); 
}; 

.... 

Answer 1

Versuch:

<select ng-options="episode as episode.season_number for episode in all_episodes track by episode.id" ng-model="selectedEpisode"> 
    <option value="">Please select an episode...</option> 
</select> 

Weitere Informationen finden Sie auf der ng-options documentation

Und hier finden auch ist eine example jsfiddle (Angular 1.5.1 verwenden)

Auch track by episode.id nicht für Ihre Version von Angular funktionieren könnte, so dass Sie es wahrscheinlich entfernen

Falls Sie beide Saison und Folge-Nummer benötigen Sie dann die folgende:

<select ng-options="episode.season_number + ' ' + episode.episode_number for episode in all_episodes track by episode.id" ng-model="selectedEpisode"> 
    <option value="">Please select an episode...</option> 
</select>